#CCEEEE - #ECECFB | 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 #CCEEEE to #ECECFB

#CCEEEE #ECECFB

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

#CCEEEE - #ECECFB | 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 #CCEEEE as 0% and #ECECFB as 100%.

0.0%	0.0% #CCEEEE	RGB 204 238 238	#CCEEEE
16.7%	16.7% #D1EDF0	RGB 209 237 240	#D1EDF0
33.3%	33.3% #D6EDF2	RGB 214 237 242	#D6EDF2
50.0%	50.0% #DCEDF4	RGB 220 237 244	#DCEDF4
66.7%	66.7% #E1ECF6	RGB 225 236 246	#E1ECF6
83.3%	83.3% #E6ECF8	RGB 230 236 248	#E6ECF8
100.0%	100.0% #ECECFB	RGB 236 236 251	#ECECFB

#CCEEEE #D1EDF0 #D6EDF2 #DCEDF4 #E1ECF6 #E6ECF8 #ECECFB

#CCEEEE - #ECECFB

HSV Blend

#CCEEEE - #ECECFB | 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 #CCEEEE as 0% and #ECECFB as 100%.

0.0%	0.0% #CCEEEE	RGB 204 238 238	#CCEEEE
16.7%	16.7% #D1EBF0	RGB 209 235 240	#D1EBF0
33.3%	33.3% #D6E9F2	RGB 214 233 242	#D6E9F2
50.0%	50.0% #DBE8F4	RGB 219 232 244	#DBE8F4
66.7%	66.7% #E1E8F6	RGB 225 232 246	#E1E8F6
83.3%	83.3% #E6E9F8	RGB 230 233 248	#E6E9F8
100.0%	100.0% #ECECFB	RGB 236 236 251	#ECECFB

#CCEEEE #D1EBF0 #D6E9F2 #DBE8F4 #E1E8F6 #E6E9F8 #ECECFB

#CCEEEE - #DBE8F4 - #ECECFB

CSS codes

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

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