#CCF7DC - #6DCFAE | 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 #CCF7DC to #6DCFAE

#CCF7DC #6DCFAE

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

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

0.0%	0.0% #CCF7DC	RGB 204 247 220	#CCF7DC
16.7%	16.7% #BCF0D4	RGB 188 240 212	#BCF0D4
33.3%	33.3% #ACE9CC	RGB 172 233 204	#ACE9CC
50.0%	50.0% #9CE3C5	RGB 156 227 197	#9CE3C5
66.7%	66.7% #8CDCBD	RGB 140 220 189	#8CDCBD
83.3%	83.3% #7CD5B5	RGB 124 213 181	#7CD5B5
100.0%	100.0% #6DCFAE	RGB 109 207 174	#6DCFAE

#CCF7DC #BCF0D4 #ACE9CC #9CE3C5 #8CDCBD #7CD5B5 #6DCFAE

#CCF7DC - #6DCFAE

HSV Blend

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

0.0%	0.0% #CCF7DC	RGB 204 247 220	#CCF7DC
16.7%	16.7% #BAF0D1	RGB 186 240 209	#BAF0D1
33.3%	33.3% #A9E9C7	RGB 169 233 199	#A9E9C7
50.0%	50.0% #99E3BF	RGB 153 227 191	#99E3BF
66.7%	66.7% #8ADCB8	RGB 138 220 184	#8ADCB8
83.3%	83.3% #7BD5B2	RGB 123 213 178	#7BD5B2
100.0%	100.0% #6DCFAE	RGB 109 207 174	#6DCFAE

#CCF7DC #BAF0D1 #A9E9C7 #99E3BF #8ADCB8 #7BD5B2 #6DCFAE

#CCF7DC - #99E3BF - #6DCFAE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CCF7DC 0%, #99E3BF 50%, #6DCFAE 100%);
    background: -webkit-linear-gradient(top, #CCF7DC 0%, #99E3BF 50%, #6DCFAE 100%);
    background: linear-gradient(to bottom, #CCF7DC 0%, #99E3BF 50%, #6DCFAE 100%);
}
</style>