#CAD9F6 - #6C8EC7 | 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 #CAD9F6 to #6C8EC7

#CAD9F6 #6C8EC7

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

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

0.0%	0.0% #CAD9F6	RGB 202 217 246	#CAD9F6
16.7%	16.7% #BACCEE	RGB 186 204 238	#BACCEE
33.3%	33.3% #AAC0E6	RGB 170 192 230	#AAC0E6
50.0%	50.0% #9BB3DE	RGB 155 179 222	#9BB3DE
66.7%	66.7% #8BA7D6	RGB 139 167 214	#8BA7D6
83.3%	83.3% #7B9ACE	RGB 123 154 206	#7B9ACE
100.0%	100.0% #6C8EC7	RGB 108 142 199	#6C8EC7

#CAD9F6 #BACCEE #AAC0E6 #9BB3DE #8BA7D6 #7B9ACE #6C8EC7

#CAD9F6 - #6C8EC7

HSV Blend

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

0.0%	0.0% #CAD9F6	RGB 202 217 246	#CAD9F6
16.7%	16.7% #B8CBEE	RGB 184 203 238	#B8CBEE
33.3%	33.3% #A7BDE6	RGB 167 189 230	#A7BDE6
50.0%	50.0% #97B1DE	RGB 151 177 222	#97B1DE
66.7%	66.7% #88A4D6	RGB 136 164 214	#88A4D6
83.3%	83.3% #7999CE	RGB 121 153 206	#7999CE
100.0%	100.0% #6C8EC7	RGB 108 142 199	#6C8EC7

#CAD9F6 #B8CBEE #A7BDE6 #97B1DE #88A4D6 #7999CE #6C8EC7

#CAD9F6 - #97B1DE - #6C8EC7

CSS codes

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

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