#B7CCE5 - #5263A8 | colorate

colorate is a color scheme tool for designers and developers. This will help you draw inspiration and serve as a resource for your color work. Make this site better

Blend #B7CCE5 to #5263A8

#B7CCE5 #5263A8

Calculate the color between two colors, #B7CCE5 and #5263A8. In calculation of RGB values, saturation between the dissimilar colors is low. In calculating of HSV values, saturation between the dissimilar colors is not low.

RGB Blend(Linear)

#B7CCE5 - #5263A8 | colorate

Calculation of color between two colors based on RGB value. For colors that are distant from each other, the saturation between the two colors decreases. Expand the color between two colors with #B7CCE5 as 0% and #5263A8 as 100%.

0.0%	0.0% #B7CCE5	RGB 183 204 229	#B7CCE5
16.7%	16.7% #A6BADA	RGB 166 186 218	#A6BADA
33.3%	33.3% #95A9D0	RGB 149 169 208	#95A9D0
50.0%	50.0% #8497C6	RGB 132 151 198	#8497C6
66.7%	66.7% #7386BC	RGB 115 134 188	#7386BC
83.3%	83.3% #6274B2	RGB 98 116 178	#6274B2
100.0%	100.0% #5263A8	RGB 82 99 168	#5263A8

#B7CCE5 #A6BADA #95A9D0 #8497C6 #7386BC #6274B2 #5263A8

#B7CCE5 - #5263A8

HSV Blend

#B7CCE5 - #5263A8 | colorate

Calculation of color between two colors based on HSV value. Even between distinct colors of color, the saturation between the two colors does not decrease. Expand the color between two colors with #B7CCE5 as 0% and #5263A8 as 100%.

0.0%	0.0% #B7CCE5	RGB 183 204 229	#B7CCE5
16.7%	16.7% #A3BADA	RGB 163 186 218	#A3BADA
33.3%	33.3% #91A8D0	RGB 145 168 208	#91A8D0
50.0%	50.0% #7F96C6	RGB 127 150 198	#7F96C6
66.7%	66.7% #6F85BC	RGB 111 133 188	#6F85BC
83.3%	83.3% #6073B2	RGB 96 115 178	#6073B2
100.0%	100.0% #5263A8	RGB 82 99 168	#5263A8

#B7CCE5 #A3BADA #91A8D0 #7F96C6 #6F85BC #6073B2 #5263A8

#B7CCE5 - #7F96C6 - #5263A8

CSS codes

<style type="text/css">
/* RGB Gradient */
div {
    background: -moz-linear-gradient(top, #B7CCE5 0%, #5263A8 100%);
    background: -webkit-linear-gradient(top, #B7CCE5 0%, #5263A8 100%);
    background: linear-gradient(to bottom, #B7CCE5 0%, #5263A8 100%);
}

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B7CCE5 0%, #7F96C6 50%, #5263A8 100%);
    background: -webkit-linear-gradient(top, #B7CCE5 0%, #7F96C6 50%, #5263A8 100%);
    background: linear-gradient(to bottom, #B7CCE5 0%, #7F96C6 50%, #5263A8 100%);
}
</style>