#CCF0E6 - #6CBFC4 | 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 #CCF0E6 to #6CBFC4

#CCF0E6 #6CBFC4

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

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

0.0%	0.0% #CCF0E6	RGB 204 240 230	#CCF0E6
16.7%	16.7% #BCE7E0	RGB 188 231 224	#BCE7E0
33.3%	33.3% #ACDFDA	RGB 172 223 218	#ACDFDA
50.0%	50.0% #9CD7D5	RGB 156 215 213	#9CD7D5
66.7%	66.7% #8CCFCF	RGB 140 207 207	#8CCFCF
83.3%	83.3% #7CC7C9	RGB 124 199 201	#7CC7C9
100.0%	100.0% #6CBFC4	RGB 108 191 196	#6CBFC4

#CCF0E6 #BCE7E0 #ACDFDA #9CD7D5 #8CCFCF #7CC7C9 #6CBFC4

#CCF0E6 - #6CBFC4

HSV Blend

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

0.0%	0.0% #CCF0E6	RGB 204 240 230	#CCF0E6
16.7%	16.7% #BAE8DE	RGB 186 232 222	#BAE8DE
33.3%	33.3% #A9E1D7	RGB 169 225 215	#A9E1D7
50.0%	50.0% #98DAD2	RGB 152 218 210	#98DAD2
66.7%	66.7% #89D2CE	RGB 137 210 206	#89D2CE
83.3%	83.3% #7ACBCB	RGB 122 203 203	#7ACBCB
100.0%	100.0% #6CBFC4	RGB 108 191 196	#6CBFC4

#CCF0E6 #BAE8DE #A9E1D7 #98DAD2 #89D2CE #7ACBCB #6CBFC4

#CCF0E6 - #98DAD2 - #6CBFC4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CCF0E6 0%, #98DAD2 50%, #6CBFC4 100%);
    background: -webkit-linear-gradient(top, #CCF0E6 0%, #98DAD2 50%, #6CBFC4 100%);
    background: linear-gradient(to bottom, #CCF0E6 0%, #98DAD2 50%, #6CBFC4 100%);
}
</style>