#48D9C2 - #00AF94 | 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 #48D9C2 to #00AF94

#48D9C2 #00AF94

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

#48D9C2 - #00AF94 | 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 #48D9C2 as 0% and #00AF94 as 100%.

0.0%	0.0% #48D9C2	RGB 72 217 194	#48D9C2
16.7%	16.7% #3CD2BA	RGB 60 210 186	#3CD2BA
33.3%	33.3% #30CBB2	RGB 48 203 178	#30CBB2
50.0%	50.0% #24C4AB	RGB 36 196 171	#24C4AB
66.7%	66.7% #18BDA3	RGB 24 189 163	#18BDA3
83.3%	83.3% #0CB69B	RGB 12 182 155	#0CB69B
100.0%	100.0% #00AF94	RGB 0 175 148	#00AF94

#48D9C2 #3CD2BA #30CBB2 #24C4AB #18BDA3 #0CB69B #00AF94

#48D9C2 - #00AF94

HSV Blend

#48D9C2 - #00AF94 | 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 #48D9C2 as 0% and #00AF94 as 100%.

0.0%	0.0% #48D9C2	RGB 72 217 194	#48D9C2
16.7%	16.7% #3AD2BA	RGB 58 210 186	#3AD2BA
33.3%	33.3% #2CCBB2	RGB 44 203 178	#2CCBB2
50.0%	50.0% #20C4AA	RGB 32 196 170	#20C4AA
66.7%	66.7% #14BDA2	RGB 20 189 162	#14BDA2
83.3%	83.3% #0AB69B	RGB 10 182 155	#0AB69B
100.0%	100.0% #00AF94	RGB 0 175 148	#00AF94

#48D9C2 #3AD2BA #2CCBB2 #20C4AA #14BDA2 #0AB69B #00AF94

#48D9C2 - #20C4AA - #00AF94

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #48D9C2 0%, #20C4AA 50%, #00AF94 100%);
    background: -webkit-linear-gradient(top, #48D9C2 0%, #20C4AA 50%, #00AF94 100%);
    background: linear-gradient(to bottom, #48D9C2 0%, #20C4AA 50%, #00AF94 100%);
}
</style>