#CCCEE7 - #6B83B0 | 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 #CCCEE7 to #6B83B0

#CCCEE7 #6B83B0

Calculate the color between two colors, #CCCEE7 and #6B83B0. 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)

#CCCEE7 - #6B83B0 | 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 #CCCEE7 as 0% and #6B83B0 as 100%.

0.0%	0.0% #CCCEE7	RGB 204 206 231	#CCCEE7
16.7%	16.7% #BBC1DD	RGB 187 193 221	#BBC1DD
33.3%	33.3% #ABB5D4	RGB 171 181 212	#ABB5D4
50.0%	50.0% #9BA8CB	RGB 155 168 203	#9BA8CB
66.7%	66.7% #8B9CC2	RGB 139 156 194	#8B9CC2
83.3%	83.3% #7B8FB9	RGB 123 143 185	#7B8FB9
100.0%	100.0% #6B83B0	RGB 107 131 176	#6B83B0

#CCCEE7 #BBC1DD #ABB5D4 #9BA8CB #8B9CC2 #7B8FB9 #6B83B0

#CCCEE7 - #6B83B0

HSV Blend

#CCCEE7 - #6B83B0 | 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 #CCCEE7 as 0% and #6B83B0 as 100%.

0.0%	0.0% #CCCEE7	RGB 204 206 231	#CCCEE7
16.7%	16.7% #B9BEDD	RGB 185 190 221	#B9BEDD
33.3%	33.3% #A8AFD4	RGB 168 175 212	#A8AFD4
50.0%	50.0% #97A2CB	RGB 151 162 203	#97A2CB
66.7%	66.7% #8796C2	RGB 135 150 194	#8796C2
83.3%	83.3% #798CB9	RGB 121 140 185	#798CB9
100.0%	100.0% #6B83B0	RGB 107 131 176	#6B83B0

#CCCEE7 #B9BEDD #A8AFD4 #97A2CB #8796C2 #798CB9 #6B83B0

#CCCEE7 - #97A2CB - #6B83B0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CCCEE7 0%, #97A2CB 50%, #6B83B0 100%);
    background: -webkit-linear-gradient(top, #CCCEE7 0%, #97A2CB 50%, #6B83B0 100%);
    background: linear-gradient(to bottom, #CCCEE7 0%, #97A2CB 50%, #6B83B0 100%);
}
</style>