#00CCC4 - #C2FFB3 | 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 #00CCC4 to #C2FFB3

#00CCC4 #C2FFB3

Calculate the color between two colors, #00CCC4 and #C2FFB3. 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)

#00CCC4 - #C2FFB3 | 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 #00CCC4 as 0% and #C2FFB3 as 100%.

0.0%	0.0% #00CCC4	RGB 0 204 196	#00CCC4
16.7%	16.7% #20D4C1	RGB 32 212 193	#20D4C1
33.3%	33.3% #40DDBE	RGB 64 221 190	#40DDBE
50.0%	50.0% #61E5BB	RGB 97 229 187	#61E5BB
66.7%	66.7% #81EEB8	RGB 129 238 184	#81EEB8
83.3%	83.3% #A1F6B5	RGB 161 246 181	#A1F6B5
100.0%	100.0% #C2FFB3	RGB 194 255 179	#C2FFB3

#00CCC4 #20D4C1 #40DDBE #61E5BB #81EEB8 #A1F6B5 #C2FFB3

#00CCC4 - #C2FFB3

HSV Blend

#00CCC4 - #C2FFB3 | 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 #00CCC4 as 0% and #C2FFB3 as 100%.

0.0%	0.0% #00CCC4	RGB 0 204 196	#00CCC4
16.7%	16.7% #18D4A8	RGB 24 212 168	#18D4A8
33.3%	33.3% #33DD95	RGB 51 221 149	#33DD95
50.0%	50.0% #50E589	RGB 80 229 137	#50E589
66.7%	66.7% #6FEE87	RGB 111 238 135	#6FEE87
83.3%	83.3% #90F690	RGB 144 246 144	#90F690
100.0%	100.0% #C2FFB3	RGB 194 255 179	#C2FFB3

#00CCC4 #18D4A8 #33DD95 #50E589 #6FEE87 #90F690 #C2FFB3

#00CCC4 - #50E589 - #C2FFB3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #00CCC4 0%, #50E589 50%, #C2FFB3 100%);
    background: -webkit-linear-gradient(top, #00CCC4 0%, #50E589 50%, #C2FFB3 100%);
    background: linear-gradient(to bottom, #00CCC4 0%, #50E589 50%, #C2FFB3 100%);
}
</style>