#CCCCFA - #D3E5F0 | 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 #CCCCFA to #D3E5F0

#CCCCFA #D3E5F0

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

#CCCCFA - #D3E5F0 | 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 #CCCCFA as 0% and #D3E5F0 as 100%.

0.0%	0.0% #CCCCFA	RGB 204 204 250	#CCCCFA
16.7%	16.7% #CDD0F8	RGB 205 208 248	#CDD0F8
33.3%	33.3% #CED4F6	RGB 206 212 246	#CED4F6
50.0%	50.0% #CFD8F5	RGB 207 216 245	#CFD8F5
66.7%	66.7% #D0DCF3	RGB 208 220 243	#D0DCF3
83.3%	83.3% #D1E0F1	RGB 209 224 241	#D1E0F1
100.0%	100.0% #D3E5F0	RGB 211 229 240	#D3E5F0

#CCCCFA #CDD0F8 #CED4F6 #CFD8F5 #D0DCF3 #D1E0F1 #D3E5F0

#CCCCFA - #D3E5F0

HSV Blend

#CCCCFA - #D3E5F0 | 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 #CCCCFA as 0% and #D3E5F0 as 100%.

0.0%	0.0% #CCCCFA	RGB 204 204 250	#CCCCFA
16.7%	16.7% #CDD1F8	RGB 205 209 248	#CDD1F8
33.3%	33.3% #CED6F6	RGB 206 214 246	#CED6F6
50.0%	50.0% #CFDBF5	RGB 207 219 245	#CFDBF5
66.7%	66.7% #D0DFF3	RGB 208 223 243	#D0DFF3
83.3%	83.3% #D1E2F1	RGB 209 226 241	#D1E2F1
100.0%	100.0% #D3E5F0	RGB 211 229 240	#D3E5F0

#CCCCFA #CDD1F8 #CED6F6 #CFDBF5 #D0DFF3 #D1E2F1 #D3E5F0

#CCCCFA - #CFDBF5 - #D3E5F0

CSS codes

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

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