#4DC3C2 - #CCEDEC | 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 #4DC3C2 to #CCEDEC

#4DC3C2 #CCEDEC

Calculate the color between two colors, #4DC3C2 and #CCEDEC. 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)

#4DC3C2 - #CCEDEC | 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 #4DC3C2 as 0% and #CCEDEC as 100%.

0.0%	0.0% #4DC3C2	RGB 77 195 194	#4DC3C2
16.7%	16.7% #62CAC9	RGB 98 202 201	#62CAC9
33.3%	33.3% #77D1D0	RGB 119 209 208	#77D1D0
50.0%	50.0% #8CD8D7	RGB 140 216 215	#8CD8D7
66.7%	66.7% #A1DFDE	RGB 161 223 222	#A1DFDE
83.3%	83.3% #B6E6E5	RGB 182 230 229	#B6E6E5
100.0%	100.0% #CCEDEC	RGB 204 237 236	#CCEDEC

#4DC3C2 #62CAC9 #77D1D0 #8CD8D7 #A1DFDE #B6E6E5 #CCEDEC

#4DC3C2 - #CCEDEC

HSV Blend

#4DC3C2 - #CCEDEC | 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 #4DC3C2 as 0% and #CCEDEC as 100%.

0.0%	0.0% #4DC3C2	RGB 77 195 194	#4DC3C2
16.7%	16.7% #5FCAC8	RGB 95 202 200	#5FCAC8
33.3%	33.3% #72D1CF	RGB 114 209 207	#72D1CF
50.0%	50.0% #87D8D6	RGB 135 216 214	#87D8D6
66.7%	66.7% #9DDFDD	RGB 157 223 221	#9DDFDD
83.3%	83.3% #B4E6E4	RGB 180 230 228	#B4E6E4
100.0%	100.0% #CCEDEC	RGB 204 237 236	#CCEDEC

#4DC3C2 #5FCAC8 #72D1CF #87D8D6 #9DDFDD #B4E6E4 #CCEDEC

#4DC3C2 - #87D8D6 - #CCEDEC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4DC3C2 0%, #87D8D6 50%, #CCEDEC 100%);
    background: -webkit-linear-gradient(top, #4DC3C2 0%, #87D8D6 50%, #CCEDEC 100%);
    background: linear-gradient(to bottom, #4DC3C2 0%, #87D8D6 50%, #CCEDEC 100%);
}
</style>