#C4CEC9 - #E3E3FF | 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 #C4CEC9 to #E3E3FF

#C4CEC9 #E3E3FF

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

#C4CEC9 - #E3E3FF | 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 #C4CEC9 as 0% and #E3E3FF as 100%.

0.0%	0.0% #C4CEC9	RGB 196 206 201	#C4CEC9
16.7%	16.7% #C9D1D2	RGB 201 209 210	#C9D1D2
33.3%	33.3% #CED5DB	RGB 206 213 219	#CED5DB
50.0%	50.0% #D3D8E4	RGB 211 216 228	#D3D8E4
66.7%	66.7% #D8DCED	RGB 216 220 237	#D8DCED
83.3%	83.3% #DDDFF6	RGB 221 223 246	#DDDFF6
100.0%	100.0% #E3E3FF	RGB 227 227 255	#E3E3FF

#C4CEC9 #C9D1D2 #CED5DB #D3D8E4 #D8DCED #DDDFF6 #E3E3FF

#C4CEC9 - #E3E3FF

HSV Blend

#C4CEC9 - #E3E3FF | 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 #C4CEC9 as 0% and #E3E3FF as 100%.

0.0%	0.0% #C4CEC9	RGB 196 206 201	#C4CEC9
16.7%	16.7% #C9D6D3	RGB 201 214 211	#C9D6D3
33.3%	33.3% #CFDEDE	RGB 207 222 222	#CFDEDE
50.0%	50.0% #D4E1E6	RGB 212 225 230	#D4E1E6
66.7%	66.7% #D9E4EE	RGB 217 228 238	#D9E4EE
83.3%	83.3% #DEE4F6	RGB 222 228 246	#DEE4F6
100.0%	100.0% #E3E3FF	RGB 227 227 255	#E3E3FF

#C4CEC9 #C9D6D3 #CFDEDE #D4E1E6 #D9E4EE #DEE4F6 #E3E3FF

#C4CEC9 - #D4E1E6 - #E3E3FF

CSS codes

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

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