#BCDBFF - #5C8FD7 | 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 #BCDBFF to #5C8FD7

#BCDBFF #5C8FD7

Calculate the color between two colors, #BCDBFF and #5C8FD7. 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)

#BCDBFF - #5C8FD7 | 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 #BCDBFF as 0% and #5C8FD7 as 100%.

0.0%	0.0% #BCDBFF	RGB 188 219 255	#BCDBFF
16.7%	16.7% #ACCEF8	RGB 172 206 248	#ACCEF8
33.3%	33.3% #9CC1F1	RGB 156 193 241	#9CC1F1
50.0%	50.0% #8CB5EB	RGB 140 181 235	#8CB5EB
66.7%	66.7% #7CA8E4	RGB 124 168 228	#7CA8E4
83.3%	83.3% #6C9BDD	RGB 108 155 221	#6C9BDD
100.0%	100.0% #5C8FD7	RGB 92 143 215	#5C8FD7

#BCDBFF #ACCEF8 #9CC1F1 #8CB5EB #7CA8E4 #6C9BDD #5C8FD7

#BCDBFF - #5C8FD7

HSV Blend

#BCDBFF - #5C8FD7 | 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 #BCDBFF as 0% and #5C8FD7 as 100%.

0.0%	0.0% #BCDBFF	RGB 188 219 255	#BCDBFF
16.7%	16.7% #AACDF8	RGB 170 205 248	#AACDF8
33.3%	33.3% #99C0F1	RGB 153 192 241	#99C0F1
50.0%	50.0% #88B3EB	RGB 136 179 235	#88B3EB
66.7%	66.7% #79A7E4	RGB 121 167 228	#79A7E4
83.3%	83.3% #6A9BDD	RGB 106 155 221	#6A9BDD
100.0%	100.0% #5C8FD7	RGB 92 143 215	#5C8FD7

#BCDBFF #AACDF8 #99C0F1 #88B3EB #79A7E4 #6A9BDD #5C8FD7

#BCDBFF - #88B3EB - #5C8FD7

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BCDBFF 0%, #88B3EB 50%, #5C8FD7 100%);
    background: -webkit-linear-gradient(top, #BCDBFF 0%, #88B3EB 50%, #5C8FD7 100%);
    background: linear-gradient(to bottom, #BCDBFF 0%, #88B3EB 50%, #5C8FD7 100%);
}
</style>