#AFE3A2 - #5FC650 | 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 #AFE3A2 to #5FC650

#AFE3A2 #5FC650

Calculate the color between two colors, #AFE3A2 and #5FC650. 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)

#AFE3A2 - #5FC650 | 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 #AFE3A2 as 0% and #5FC650 as 100%.

0.0%	0.0% #AFE3A2	RGB 175 227 162	#AFE3A2
16.7%	16.7% #A1DE94	RGB 161 222 148	#A1DE94
33.3%	33.3% #94D986	RGB 148 217 134	#94D986
50.0%	50.0% #87D479	RGB 135 212 121	#87D479
66.7%	66.7% #79CF6B	RGB 121 207 107	#79CF6B
83.3%	83.3% #6CCA5D	RGB 108 202 93	#6CCA5D
100.0%	100.0% #5FC650	RGB 95 198 80	#5FC650

#AFE3A2 #A1DE94 #94D986 #87D479 #79CF6B #6CCA5D #5FC650

#AFE3A2 - #5FC650

HSV Blend

#AFE3A2 - #5FC650 | 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 #AFE3A2 as 0% and #5FC650 as 100%.

0.0%	0.0% #AFE3A2	RGB 175 227 162	#AFE3A2
16.7%	16.7% #A1DE93	RGB 161 222 147	#A1DE93
33.3%	33.3% #93D984	RGB 147 217 132	#93D984
50.0%	50.0% #86D476	RGB 134 212 118	#86D476
66.7%	66.7% #78CF69	RGB 120 207 105	#78CF69
83.3%	83.3% #6BCA5C	RGB 107 202 92	#6BCA5C
100.0%	100.0% #5FC650	RGB 95 198 80	#5FC650

#AFE3A2 #A1DE93 #93D984 #86D476 #78CF69 #6BCA5C #5FC650

#AFE3A2 - #86D476 - #5FC650

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AFE3A2 0%, #86D476 50%, #5FC650 100%);
    background: -webkit-linear-gradient(top, #AFE3A2 0%, #86D476 50%, #5FC650 100%);
    background: linear-gradient(to bottom, #AFE3A2 0%, #86D476 50%, #5FC650 100%);
}
</style>