#BFDDF2 - #ECF5FB | 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 #BFDDF2 to #ECF5FB

#BFDDF2 #ECF5FB

Calculate the color between two colors, #BFDDF2 and #ECF5FB. 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)

#BFDDF2 - #ECF5FB | 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 #BFDDF2 as 0% and #ECF5FB as 100%.

0.0%	0.0% #BFDDF2	RGB 191 221 242	#BFDDF2
16.7%	16.7% #C6E1F3	RGB 198 225 243	#C6E1F3
33.3%	33.3% #CEE5F5	RGB 206 229 245	#CEE5F5
50.0%	50.0% #D5E9F6	RGB 213 233 246	#D5E9F6
66.7%	66.7% #DDEDF8	RGB 221 237 248	#DDEDF8
83.3%	83.3% #E4F1F9	RGB 228 241 249	#E4F1F9
100.0%	100.0% #ECF5FB	RGB 236 245 251	#ECF5FB

#BFDDF2 #C6E1F3 #CEE5F5 #D5E9F6 #DDEDF8 #E4F1F9 #ECF5FB

#BFDDF2 - #ECF5FB

HSV Blend

#BFDDF2 - #ECF5FB | 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 #BFDDF2 as 0% and #ECF5FB as 100%.

0.0%	0.0% #BFDDF2	RGB 191 221 242	#BFDDF2
16.7%	16.7% #C6E0F3	RGB 198 224 243	#C6E0F3
33.3%	33.3% #CDE4F5	RGB 205 228 245	#CDE4F5
50.0%	50.0% #D5E8F6	RGB 213 232 246	#D5E8F6
66.7%	66.7% #DCECF8	RGB 220 236 248	#DCECF8
83.3%	83.3% #E4F0F9	RGB 228 240 249	#E4F0F9
100.0%	100.0% #ECF5FB	RGB 236 245 251	#ECF5FB

#BFDDF2 #C6E0F3 #CDE4F5 #D5E8F6 #DCECF8 #E4F0F9 #ECF5FB

#BFDDF2 - #D5E8F6 - #ECF5FB

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BFDDF2 0%, #D5E8F6 50%, #ECF5FB 100%);
    background: -webkit-linear-gradient(top, #BFDDF2 0%, #D5E8F6 50%, #ECF5FB 100%);
    background: linear-gradient(to bottom, #BFDDF2 0%, #D5E8F6 50%, #ECF5FB 100%);
}
</style>