#AFD9A1 - #5BAB4C | 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 #AFD9A1 to #5BAB4C

#AFD9A1 #5BAB4C

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

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

0.0%	0.0% #AFD9A1	RGB 175 217 161	#AFD9A1
16.7%	16.7% #A1D192	RGB 161 209 146	#A1D192
33.3%	33.3% #93C984	RGB 147 201 132	#93C984
50.0%	50.0% #85C276	RGB 133 194 118	#85C276
66.7%	66.7% #77BA68	RGB 119 186 104	#77BA68
83.3%	83.3% #69B25A	RGB 105 178 90	#69B25A
100.0%	100.0% #5BAB4C	RGB 91 171 76	#5BAB4C

#AFD9A1 #A1D192 #93C984 #85C276 #77BA68 #69B25A #5BAB4C

#AFD9A1 - #5BAB4C

HSV Blend

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

0.0%	0.0% #AFD9A1	RGB 175 217 161	#AFD9A1
16.7%	16.7% #A0D190	RGB 160 209 144	#A0D190
33.3%	33.3% #91C981	RGB 145 201 129	#91C981
50.0%	50.0% #83C273	RGB 131 194 115	#83C273
66.7%	66.7% #75BA65	RGB 117 186 101	#75BA65
83.3%	83.3% #67B258	RGB 103 178 88	#67B258
100.0%	100.0% #5BAB4C	RGB 91 171 76	#5BAB4C

#AFD9A1 #A0D190 #91C981 #83C273 #75BA65 #67B258 #5BAB4C

#AFD9A1 - #83C273 - #5BAB4C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AFD9A1 0%, #83C273 50%, #5BAB4C 100%);
    background: -webkit-linear-gradient(top, #AFD9A1 0%, #83C273 50%, #5BAB4C 100%);
    background: linear-gradient(to bottom, #AFD9A1 0%, #83C273 50%, #5BAB4C 100%);
}
</style>