#CCCCEC - #6980B7 | 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 #CCCCEC to #6980B7

#CCCCEC #6980B7

Calculate the color between two colors, #CCCCEC and #6980B7. 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)

#CCCCEC - #6980B7 | 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 #CCCCEC as 0% and #6980B7 as 100%.

0.0%	0.0% #CCCCEC	RGB 204 204 236	#CCCCEC
16.7%	16.7% #BBBFE3	RGB 187 191 227	#BBBFE3
33.3%	33.3% #ABB2DA	RGB 171 178 218	#ABB2DA
50.0%	50.0% #9AA6D1	RGB 154 166 209	#9AA6D1
66.7%	66.7% #8A99C8	RGB 138 153 200	#8A99C8
83.3%	83.3% #798CBF	RGB 121 140 191	#798CBF
100.0%	100.0% #6980B7	RGB 105 128 183	#6980B7

#CCCCEC #BBBFE3 #ABB2DA #9AA6D1 #8A99C8 #798CBF #6980B7

#CCCCEC - #6980B7

HSV Blend

#CCCCEC - #6980B7 | 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 #CCCCEC as 0% and #6980B7 as 100%.

0.0%	0.0% #CCCCEC	RGB 204 204 236	#CCCCEC
16.7%	16.7% #B9BBE3	RGB 185 187 227	#B9BBE3
33.3%	33.3% #A7ACDA	RGB 167 172 218	#A7ACDA
50.0%	50.0% #969FD1	RGB 150 159 209	#969FD1
66.7%	66.7% #8693C8	RGB 134 147 200	#8693C8
83.3%	83.3% #7789BF	RGB 119 137 191	#7789BF
100.0%	100.0% #6980B7	RGB 105 128 183	#6980B7

#CCCCEC #B9BBE3 #A7ACDA #969FD1 #8693C8 #7789BF #6980B7

#CCCCEC - #969FD1 - #6980B7

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CCCCEC 0%, #969FD1 50%, #6980B7 100%);
    background: -webkit-linear-gradient(top, #CCCCEC 0%, #969FD1 50%, #6980B7 100%);
    background: linear-gradient(to bottom, #CCCCEC 0%, #969FD1 50%, #6980B7 100%);
}
</style>