#C0CCFF - #566BCE | 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 #C0CCFF to #566BCE

#C0CCFF #566BCE

Calculate the color between two colors, #C0CCFF and #566BCE. 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)

#C0CCFF - #566BCE | 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 #C0CCFF as 0% and #566BCE as 100%.

0.0%	0.0% #C0CCFF	RGB 192 204 255	#C0CCFF
16.7%	16.7% #AEBBF6	RGB 174 187 246	#AEBBF6
33.3%	33.3% #9CABEE	RGB 156 171 238	#9CABEE
50.0%	50.0% #8B9BE6	RGB 139 155 230	#8B9BE6
66.7%	66.7% #798BDE	RGB 121 139 222	#798BDE
83.3%	83.3% #677BD6	RGB 103 123 214	#677BD6
100.0%	100.0% #566BCE	RGB 86 107 206	#566BCE

#C0CCFF #AEBBF6 #9CABEE #8B9BE6 #798BDE #677BD6 #566BCE

#C0CCFF - #566BCE

HSV Blend

#C0CCFF - #566BCE | 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 #C0CCFF as 0% and #566BCE as 100%.

0.0%	0.0% #C0CCFF	RGB 192 204 255	#C0CCFF
16.7%	16.7% #ACBAF6	RGB 172 186 246	#ACBAF6
33.3%	33.3% #99A8EE	RGB 153 168 238	#99A8EE
50.0%	50.0% #8698E6	RGB 134 152 230	#8698E6
66.7%	66.7% #7588DE	RGB 117 136 222	#7588DE
83.3%	83.3% #6579D6	RGB 101 121 214	#6579D6
100.0%	100.0% #566BCE	RGB 86 107 206	#566BCE

#C0CCFF #ACBAF6 #99A8EE #8698E6 #7588DE #6579D6 #566BCE

#C0CCFF - #8698E6 - #566BCE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C0CCFF 0%, #8698E6 50%, #566BCE 100%);
    background: -webkit-linear-gradient(top, #C0CCFF 0%, #8698E6 50%, #566BCE 100%);
    background: linear-gradient(to bottom, #C0CCFF 0%, #8698E6 50%, #566BCE 100%);
}
</style>