#BCD1F0 - #5E83BF | 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 #BCD1F0 to #5E83BF

#BCD1F0 #5E83BF

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

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

0.0%	0.0% #BCD1F0	RGB 188 209 240	#BCD1F0
16.7%	16.7% #ACC4E7	RGB 172 196 231	#ACC4E7
33.3%	33.3% #9CB7DF	RGB 156 183 223	#9CB7DF
50.0%	50.0% #8DAAD7	RGB 141 170 215	#8DAAD7
66.7%	66.7% #7D9DCF	RGB 125 157 207	#7D9DCF
83.3%	83.3% #6D90C7	RGB 109 144 199	#6D90C7
100.0%	100.0% #5E83BF	RGB 94 131 191	#5E83BF

#BCD1F0 #ACC4E7 #9CB7DF #8DAAD7 #7D9DCF #6D90C7 #5E83BF

#BCD1F0 - #5E83BF

HSV Blend

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

0.0%	0.0% #BCD1F0	RGB 188 209 240	#BCD1F0
16.7%	16.7% #AAC2E7	RGB 170 194 231	#AAC2E7
33.3%	33.3% #99B5DF	RGB 153 181 223	#99B5DF
50.0%	50.0% #89A8D7	RGB 137 168 215	#89A8D7
66.7%	66.7% #7A9BCF	RGB 122 155 207	#7A9BCF
83.3%	83.3% #6B8EC7	RGB 107 142 199	#6B8EC7
100.0%	100.0% #5E83BF	RGB 94 131 191	#5E83BF

#BCD1F0 #AAC2E7 #99B5DF #89A8D7 #7A9BCF #6B8EC7 #5E83BF

#BCD1F0 - #89A8D7 - #5E83BF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BCD1F0 0%, #89A8D7 50%, #5E83BF 100%);
    background: -webkit-linear-gradient(top, #BCD1F0 0%, #89A8D7 50%, #5E83BF 100%);
    background: linear-gradient(to bottom, #BCD1F0 0%, #89A8D7 50%, #5E83BF 100%);
}
</style>