#C8DDF7 - #669DC8 | 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 #C8DDF7 to #669DC8

#C8DDF7 #669DC8

Calculate the color between two colors, #C8DDF7 and #669DC8. 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)

#C8DDF7 - #669DC8 | 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 #C8DDF7 as 0% and #669DC8 as 100%.

0.0%	0.0% #C8DDF7	RGB 200 221 247	#C8DDF7
16.7%	16.7% #B7D2EF	RGB 183 210 239	#B7D2EF
33.3%	33.3% #A7C7E7	RGB 167 199 231	#A7C7E7
50.0%	50.0% #97BDDF	RGB 151 189 223	#97BDDF
66.7%	66.7% #86B2D7	RGB 134 178 215	#86B2D7
83.3%	83.3% #76A7CF	RGB 118 167 207	#76A7CF
100.0%	100.0% #669DC8	RGB 102 157 200	#669DC8

#C8DDF7 #B7D2EF #A7C7E7 #97BDDF #86B2D7 #76A7CF #669DC8

#C8DDF7 - #669DC8

HSV Blend

#C8DDF7 - #669DC8 | 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 #C8DDF7 as 0% and #669DC8 as 100%.

0.0%	0.0% #C8DDF7	RGB 200 221 247	#C8DDF7
16.7%	16.7% #B5D0EF	RGB 181 208 239	#B5D0EF
33.3%	33.3% #A4C4E7	RGB 164 196 231	#A4C4E7
50.0%	50.0% #93B9DF	RGB 147 185 223	#93B9DF
66.7%	66.7% #83AFD7	RGB 131 175 215	#83AFD7
83.3%	83.3% #74A5CF	RGB 116 165 207	#74A5CF
100.0%	100.0% #669DC8	RGB 102 157 200	#669DC8

#C8DDF7 #B5D0EF #A4C4E7 #93B9DF #83AFD7 #74A5CF #669DC8

#C8DDF7 - #93B9DF - #669DC8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C8DDF7 0%, #93B9DF 50%, #669DC8 100%);
    background: -webkit-linear-gradient(top, #C8DDF7 0%, #93B9DF 50%, #669DC8 100%);
    background: linear-gradient(to bottom, #C8DDF7 0%, #93B9DF 50%, #669DC8 100%);
}
</style>