#52D9A8 - #02AB76 | 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 #52D9A8 to #02AB76

#52D9A8 #02AB76

Calculate the color between two colors, #52D9A8 and #02AB76. 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)

#52D9A8 - #02AB76 | 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 #52D9A8 as 0% and #02AB76 as 100%.

0.0%	0.0% #52D9A8	RGB 82 217 168	#52D9A8
16.7%	16.7% #44D19F	RGB 68 209 159	#44D19F
33.3%	33.3% #37C997	RGB 55 201 151	#37C997
50.0%	50.0% #2AC28F	RGB 42 194 143	#2AC28F
66.7%	66.7% #1CBA86	RGB 28 186 134	#1CBA86
83.3%	83.3% #0FB27E	RGB 15 178 126	#0FB27E
100.0%	100.0% #02AB76	RGB 2 171 118	#02AB76

#52D9A8 #44D19F #37C997 #2AC28F #1CBA86 #0FB27E #02AB76

#52D9A8 - #02AB76

HSV Blend

#52D9A8 - #02AB76 | 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 #52D9A8 as 0% and #02AB76 as 100%.

0.0%	0.0% #52D9A8	RGB 82 217 168	#52D9A8
16.7%	16.7% #42D19E	RGB 66 209 158	#42D19E
33.3%	33.3% #33C995	RGB 51 201 149	#33C995
50.0%	50.0% #25C28D	RGB 37 194 141	#25C28D
66.7%	66.7% #18BA85	RGB 24 186 133	#18BA85
83.3%	83.3% #0CB27D	RGB 12 178 125	#0CB27D
100.0%	100.0% #02AB76	RGB 2 171 118	#02AB76

#52D9A8 #42D19E #33C995 #25C28D #18BA85 #0CB27D #02AB76

#52D9A8 - #25C28D - #02AB76

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #52D9A8 0%, #25C28D 50%, #02AB76 100%);
    background: -webkit-linear-gradient(top, #52D9A8 0%, #25C28D 50%, #02AB76 100%);
    background: linear-gradient(to bottom, #52D9A8 0%, #25C28D 50%, #02AB76 100%);
}
</style>