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

#BFDFF2 #ECF5FB

Calculate the color between two colors, #BFDFF2 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)

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

0.0%	0.0% #BFDFF2	RGB 191 223 242	#BFDFF2
16.7%	16.7% #C6E2F3	RGB 198 226 243	#C6E2F3
33.3%	33.3% #CEE6F5	RGB 206 230 245	#CEE6F5
50.0%	50.0% #D5EAF6	RGB 213 234 246	#D5EAF6
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

#BFDFF2 #C6E2F3 #CEE6F5 #D5EAF6 #DDEDF8 #E4F1F9 #ECF5FB

#BFDFF2 - #ECF5FB

HSV Blend

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

0.0%	0.0% #BFDFF2	RGB 191 223 242	#BFDFF2
16.7%	16.7% #C6E2F3	RGB 198 226 243	#C6E2F3
33.3%	33.3% #CDE5F5	RGB 205 229 245	#CDE5F5
50.0%	50.0% #D5E9F6	RGB 213 233 246	#D5E9F6
66.7%	66.7% #DCEDF8	RGB 220 237 248	#DCEDF8
83.3%	83.3% #E4F1F9	RGB 228 241 249	#E4F1F9
100.0%	100.0% #ECF5FB	RGB 236 245 251	#ECF5FB

#BFDFF2 #C6E2F3 #CDE5F5 #D5E9F6 #DCEDF8 #E4F1F9 #ECF5FB

#BFDFF2 - #D5E9F6 - #ECF5FB

CSS codes

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

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