#02B2A8 - #B3FEB0 | 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 #02B2A8 to #B3FEB0

#02B2A8 #B3FEB0

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

#02B2A8 - #B3FEB0 | 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 #02B2A8 as 0% and #B3FEB0 as 100%.

0.0%	0.0% #02B2A8	RGB 2 178 168	#02B2A8
16.7%	16.7% #1FBEA9	RGB 31 190 169	#1FBEA9
33.3%	33.3% #3DCBAA	RGB 61 203 170	#3DCBAA
50.0%	50.0% #5AD8AC	RGB 90 216 172	#5AD8AC
66.7%	66.7% #78E4AD	RGB 120 228 173	#78E4AD
83.3%	83.3% #95F1AE	RGB 149 241 174	#95F1AE
100.0%	100.0% #B3FEB0	RGB 179 254 176	#B3FEB0

#02B2A8 #1FBEA9 #3DCBAA #5AD8AC #78E4AD #95F1AE #B3FEB0

#02B2A8 - #B3FEB0

HSV Blend

#02B2A8 - #B3FEB0 | 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 #02B2A8 as 0% and #B3FEB0 as 100%.

0.0%	0.0% #01B2A8	RGB 1 178 168	#01B2A8
16.7%	16.7% #17BE99	RGB 23 190 153	#17BE99
33.3%	33.3% #30CB8F	RGB 48 203 143	#30CB8F
50.0%	50.0% #4CD88B	RGB 76 216 139	#4CD88B
66.7%	66.7% #6AE48D	RGB 106 228 141	#6AE48D
83.3%	83.3% #8BF198	RGB 139 241 152	#8BF198
100.0%	100.0% #B3FEB0	RGB 179 254 176	#B3FEB0

#01B2A8 #17BE99 #30CB8F #4CD88B #6AE48D #8BF198 #B3FEB0

#02B2A8 - #4CD88B - #B3FEB0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #01B2A8 0%, #4CD88B 50%, #B3FEB0 100%);
    background: -webkit-linear-gradient(top, #01B2A8 0%, #4CD88B 50%, #B3FEB0 100%);
    background: linear-gradient(to bottom, #01B2A8 0%, #4CD88B 50%, #B3FEB0 100%);
}
</style>