#A2DDB1 - #48A97C | 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 #A2DDB1 to #48A97C

#A2DDB1 #48A97C

Calculate the color between two colors, #A2DDB1 and #48A97C. 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)

#A2DDB1 - #48A97C | 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 #A2DDB1 as 0% and #48A97C as 100%.

0.0%	0.0% #A2DDB1	RGB 162 221 177	#A2DDB1
16.7%	16.7% #93D4A8	RGB 147 212 168	#93D4A8
33.3%	33.3% #84CB9F	RGB 132 203 159	#84CB9F
50.0%	50.0% #75C396	RGB 117 195 150	#75C396
66.7%	66.7% #66BA8D	RGB 102 186 141	#66BA8D
83.3%	83.3% #57B184	RGB 87 177 132	#57B184
100.0%	100.0% #48A97C	RGB 72 169 124	#48A97C

#A2DDB1 #93D4A8 #84CB9F #75C396 #66BA8D #57B184 #48A97C

#A2DDB1 - #48A97C

HSV Blend

#A2DDB1 - #48A97C | 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 #A2DDB1 as 0% and #48A97C as 100%.

0.0%	0.0% #A2DDB1	RGB 162 221 177	#A2DDB1
16.7%	16.7% #90D4A5	RGB 144 212 165	#90D4A5
33.3%	33.3% #80CB9A	RGB 128 203 154	#80CB9A
50.0%	50.0% #71C391	RGB 113 195 145	#71C391
66.7%	66.7% #62BA89	RGB 98 186 137	#62BA89
83.3%	83.3% #54B182	RGB 84 177 130	#54B182
100.0%	100.0% #48A97C	RGB 72 169 124	#48A97C

#A2DDB1 #90D4A5 #80CB9A #71C391 #62BA89 #54B182 #48A97C

#A2DDB1 - #71C391 - #48A97C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A2DDB1 0%, #71C391 50%, #48A97C 100%);
    background: -webkit-linear-gradient(top, #A2DDB1 0%, #71C391 50%, #48A97C 100%);
    background: linear-gradient(to bottom, #A2DDB1 0%, #71C391 50%, #48A97C 100%);
}
</style>