#C4DDF6 - #6893C8 | 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 #C4DDF6 to #6893C8

#C4DDF6 #6893C8

Calculate the color between two colors, #C4DDF6 and #6893C8. 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)

#C4DDF6 - #6893C8 | 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 #C4DDF6 as 0% and #6893C8 as 100%.

0.0%	0.0% #C4DDF6	RGB 196 221 246	#C4DDF6
16.7%	16.7% #B4D0EE	RGB 180 208 238	#B4D0EE
33.3%	33.3% #A5C4E6	RGB 165 196 230	#A5C4E6
50.0%	50.0% #96B8DF	RGB 150 184 223	#96B8DF
66.7%	66.7% #86ABD7	RGB 134 171 215	#86ABD7
83.3%	83.3% #779FCF	RGB 119 159 207	#779FCF
100.0%	100.0% #6893C8	RGB 104 147 200	#6893C8

#C4DDF6 #B4D0EE #A5C4E6 #96B8DF #86ABD7 #779FCF #6893C8

#C4DDF6 - #6893C8

HSV Blend

#C4DDF6 - #6893C8 | 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 #C4DDF6 as 0% and #6893C8 as 100%.

0.0%	0.0% #C4DDF6	RGB 196 221 246	#C4DDF6
16.7%	16.7% #B2D0EE	RGB 178 208 238	#B2D0EE
33.3%	33.3% #A2C3E6	RGB 162 195 230	#A2C3E6
50.0%	50.0% #92B6DF	RGB 146 182 223	#92B6DF
66.7%	66.7% #83AAD7	RGB 131 170 215	#83AAD7
83.3%	83.3% #759ECF	RGB 117 158 207	#759ECF
100.0%	100.0% #6893C8	RGB 104 147 200	#6893C8

#C4DDF6 #B2D0EE #A2C3E6 #92B6DF #83AAD7 #759ECF #6893C8

#C4DDF6 - #92B6DF - #6893C8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C4DDF6 0%, #92B6DF 50%, #6893C8 100%);
    background: -webkit-linear-gradient(top, #C4DDF6 0%, #92B6DF 50%, #6893C8 100%);
    background: linear-gradient(to bottom, #C4DDF6 0%, #92B6DF 50%, #6893C8 100%);
}
</style>