#CCC2FF - #F0EDFF | 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 #CCC2FF to #F0EDFF

#CCC2FF #F0EDFF

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

#CCC2FF - #F0EDFF | 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 #CCC2FF as 0% and #F0EDFF as 100%.

0.0%	0.0% #CCC2FF	RGB 204 194 255	#CCC2FF
16.7%	16.7% #D2C9FF	RGB 210 201 255	#D2C9FF
33.3%	33.3% #D8D0FF	RGB 216 208 255	#D8D0FF
50.0%	50.0% #DED7FF	RGB 222 215 255	#DED7FF
66.7%	66.7% #E4DEFF	RGB 228 222 255	#E4DEFF
83.3%	83.3% #EAE5FF	RGB 234 229 255	#EAE5FF
100.0%	100.0% #F0EDFF	RGB 240 237 255	#F0EDFF

#CCC2FF #D2C9FF #D8D0FF #DED7FF #E4DEFF #EAE5FF #F0EDFF

#CCC2FF - #F0EDFF

HSV Blend

#CCC2FF - #F0EDFF | 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 #CCC2FF as 0% and #F0EDFF as 100%.

0.0%	0.0% #CCC2FF	RGB 204 194 255	#CCC2FF
16.7%	16.7% #D2C9FF	RGB 210 201 255	#D2C9FF
33.3%	33.3% #D8D0FF	RGB 216 208 255	#D8D0FF
50.0%	50.0% #DED7FF	RGB 222 215 255	#DED7FF
66.7%	66.7% #E4DEFF	RGB 228 222 255	#E4DEFF
83.3%	83.3% #EAE5FF	RGB 234 229 255	#EAE5FF
100.0%	100.0% #F0EDFF	RGB 240 237 255	#F0EDFF

#CCC2FF #D2C9FF #D8D0FF #DED7FF #E4DEFF #EAE5FF #F0EDFF

#CCC2FF - #DED7FF - #F0EDFF

CSS codes

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

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