#C7E7F1 - #6CAAC0 | 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 #C7E7F1 to #6CAAC0

#C7E7F1 #6CAAC0

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

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

0.0%	0.0% #C7E7F1	RGB 199 231 241	#C7E7F1
16.7%	16.7% #B7DCE8	RGB 183 220 232	#B7DCE8
33.3%	33.3% #A8D2E0	RGB 168 210 224	#A8D2E0
50.0%	50.0% #99C8D8	RGB 153 200 216	#99C8D8
66.7%	66.7% #8ABED0	RGB 138 190 208	#8ABED0
83.3%	83.3% #7BB4C8	RGB 123 180 200	#7BB4C8
100.0%	100.0% #6CAAC0	RGB 108 170 192	#6CAAC0

#C7E7F1 #B7DCE8 #A8D2E0 #99C8D8 #8ABED0 #7BB4C8 #6CAAC0

#C7E7F1 - #6CAAC0

HSV Blend

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

0.0%	0.0% #C7E7F1	RGB 199 231 241	#C7E7F1
16.7%	16.7% #B6DCE8	RGB 182 220 232	#B6DCE8
33.3%	33.3% #A5D2E0	RGB 165 210 224	#A5D2E0
50.0%	50.0% #96C7D8	RGB 150 199 216	#96C7D8
66.7%	66.7% #87BDD0	RGB 135 189 208	#87BDD0
83.3%	83.3% #79B3C8	RGB 121 179 200	#79B3C8
100.0%	100.0% #6CAAC0	RGB 108 170 192	#6CAAC0

#C7E7F1 #B6DCE8 #A5D2E0 #96C7D8 #87BDD0 #79B3C8 #6CAAC0

#C7E7F1 - #96C7D8 - #6CAAC0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C7E7F1 0%, #96C7D8 50%, #6CAAC0 100%);
    background: -webkit-linear-gradient(top, #C7E7F1 0%, #96C7D8 50%, #6CAAC0 100%);
    background: linear-gradient(to bottom, #C7E7F1 0%, #96C7D8 50%, #6CAAC0 100%);
}
</style>