#ECF2F1 - #C9DDF2 | 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 #ECF2F1 to #C9DDF2

#ECF2F1 #C9DDF2

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

#ECF2F1 - #C9DDF2 | 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 #ECF2F1 as 0% and #C9DDF2 as 100%.

0.0%	0.0% #ECF2F1	RGB 236 242 241	#ECF2F1
16.7%	16.7% #E6EEF1	RGB 230 238 241	#E6EEF1
33.3%	33.3% #E0EBF1	RGB 224 235 241	#E0EBF1
50.0%	50.0% #DAE7F1	RGB 218 231 241	#DAE7F1
66.7%	66.7% #D4E4F1	RGB 212 228 241	#D4E4F1
83.3%	83.3% #CEE0F1	RGB 206 224 241	#CEE0F1
100.0%	100.0% #C9DDF2	RGB 201 221 242	#C9DDF2

#ECF2F1 #E6EEF1 #E0EBF1 #DAE7F1 #D4E4F1 #CEE0F1 #C9DDF2

#ECF2F1 - #C9DDF2

HSV Blend

#ECF2F1 - #C9DDF2 | 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 #ECF2F1 as 0% and #C9DDF2 as 100%.

0.0%	0.0% #ECF2F1	RGB 236 242 241	#ECF2F1
16.7%	16.7% #E6F2F1	RGB 230 242 241	#E6F2F1
33.3%	33.3% #E0F0F2	RGB 224 240 242	#E0F0F2
50.0%	50.0% #DAEDF2	RGB 218 237 242	#DAEDF2
66.7%	66.7% #D4E9F2	RGB 212 233 242	#D4E9F2
83.3%	83.3% #CEE3F2	RGB 206 227 242	#CEE3F2
100.0%	100.0% #C9DDF2	RGB 201 221 242	#C9DDF2

#ECF2F1 #E6F2F1 #E0F0F2 #DAEDF2 #D4E9F2 #CEE3F2 #C9DDF2

#ECF2F1 - #DAEDF2 - #C9DDF2

CSS codes

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

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