#CCB8FF - #664FD4 | 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 #CCB8FF to #664FD4

#CCB8FF #664FD4

Calculate the color between two colors, #CCB8FF and #664FD4. 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)

#CCB8FF - #664FD4 | 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 #CCB8FF as 0% and #664FD4 as 100%.

0.0%	0.0% #CCB8FF	RGB 204 184 255	#CCB8FF
16.7%	16.7% #BBA6F7	RGB 187 166 247	#BBA6F7
33.3%	33.3% #AA95F0	RGB 170 149 240	#AA95F0
50.0%	50.0% #9983E9	RGB 153 131 233	#9983E9
66.7%	66.7% #8872E2	RGB 136 114 226	#8872E2
83.3%	83.3% #7760DB	RGB 119 96 219	#7760DB
100.0%	100.0% #664FD4	RGB 102 79 212	#664FD4

#CCB8FF #BBA6F7 #AA95F0 #9983E9 #8872E2 #7760DB #664FD4

#CCB8FF - #664FD4

HSV Blend

#CCB8FF - #664FD4 | 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 #CCB8FF as 0% and #664FD4 as 100%.

0.0%	0.0% #CCB8FF	RGB 204 184 255	#CCB8FF
16.7%	16.7% #BAA4F7	RGB 186 164 247	#BAA4F7
33.3%	33.3% #A891F0	RGB 168 145 240	#A891F0
50.0%	50.0% #977FE9	RGB 151 127 233	#977FE9
66.7%	66.7% #866EE2	RGB 134 110 226	#866EE2
83.3%	83.3% #765EDB	RGB 118 94 219	#765EDB
100.0%	100.0% #664FD4	RGB 102 79 212	#664FD4

#CCB8FF #BAA4F7 #A891F0 #977FE9 #866EE2 #765EDB #664FD4

#CCB8FF - #977FE9 - #664FD4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CCB8FF 0%, #977FE9 50%, #664FD4 100%);
    background: -webkit-linear-gradient(top, #CCB8FF 0%, #977FE9 50%, #664FD4 100%);
    background: linear-gradient(to bottom, #CCB8FF 0%, #977FE9 50%, #664FD4 100%);
}
</style>