#00AFA7 - #AFFDB0 | 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 #00AFA7 to #AFFDB0

#00AFA7 #AFFDB0

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

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

0.0%	0.0% #00AFA7	RGB 0 175 167	#00AFA7
16.7%	16.7% #1DBCA8	RGB 29 188 168	#1DBCA8
33.3%	33.3% #3AC9AA	RGB 58 201 170	#3AC9AA
50.0%	50.0% #57D6AB	RGB 87 214 171	#57D6AB
66.7%	66.7% #74E3AD	RGB 116 227 173	#74E3AD
83.3%	83.3% #91F0AE	RGB 145 240 174	#91F0AE
100.0%	100.0% #AFFDB0	RGB 175 253 176	#AFFDB0

#00AFA7 #1DBCA8 #3AC9AA #57D6AB #74E3AD #91F0AE #AFFDB0

#00AFA7 - #AFFDB0

HSV Blend

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

0.0%	0.0% #00AFA7	RGB 0 175 167	#00AFA7
16.7%	16.7% #15BC9A	RGB 21 188 154	#15BC9A
33.3%	33.3% #2EC991	RGB 46 201 145	#2EC991
50.0%	50.0% #4AD68D	RGB 74 214 141	#4AD68D
66.7%	66.7% #68E390	RGB 104 227 144	#68E390
83.3%	83.3% #8AF09B	RGB 138 240 155	#8AF09B
100.0%	100.0% #AFFDB0	RGB 175 253 176	#AFFDB0

#00AFA7 #15BC9A #2EC991 #4AD68D #68E390 #8AF09B #AFFDB0

#00AFA7 - #4AD68D - #AFFDB0

CSS codes

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

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