#CCCCEB - #786EB0 | 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 #CCCCEB to #786EB0

#CCCCEB #786EB0

Calculate the color between two colors, #CCCCEB and #786EB0. 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)

#CCCCEB - #786EB0 | 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 #CCCCEB as 0% and #786EB0 as 100%.

0.0%	0.0% #CCCCEB	RGB 204 204 235	#CCCCEB
16.7%	16.7% #BEBCE1	RGB 190 188 225	#BEBCE1
33.3%	33.3% #B0ACD7	RGB 176 172 215	#B0ACD7
50.0%	50.0% #A29DCD	RGB 162 157 205	#A29DCD
66.7%	66.7% #948DC3	RGB 148 141 195	#948DC3
83.3%	83.3% #867DB9	RGB 134 125 185	#867DB9
100.0%	100.0% #786EB0	RGB 120 110 176	#786EB0

#CCCCEB #BEBCE1 #B0ACD7 #A29DCD #948DC3 #867DB9 #786EB0

#CCCCEB - #786EB0

HSV Blend

#CCCCEB - #786EB0 | 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 #CCCCEB as 0% and #786EB0 as 100%.

0.0%	0.0% #CCCCEB	RGB 204 204 235	#CCCCEB
16.7%	16.7% #BBBAE1	RGB 187 186 225	#BBBAE1
33.3%	33.3% #ABA9D7	RGB 171 169 215	#ABA9D7
50.0%	50.0% #9D99CD	RGB 157 153 205	#9D99CD
66.7%	66.7% #8F8AC3	RGB 143 138 195	#8F8AC3
83.3%	83.3% #837BB9	RGB 131 123 185	#837BB9
100.0%	100.0% #786EB0	RGB 120 110 176	#786EB0

#CCCCEB #BBBAE1 #ABA9D7 #9D99CD #8F8AC3 #837BB9 #786EB0

#CCCCEB - #9D99CD - #786EB0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CCCCEB 0%, #9D99CD 50%, #786EB0 100%);
    background: -webkit-linear-gradient(top, #CCCCEB 0%, #9D99CD 50%, #786EB0 100%);
    background: linear-gradient(to bottom, #CCCCEB 0%, #9D99CD 50%, #786EB0 100%);
}
</style>