#48D1CC - #00A69E | 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 #48D1CC to #00A69E

#48D1CC #00A69E

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

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

0.0%	0.0% #48D1CC	RGB 72 209 204	#48D1CC
16.7%	16.7% #3CC9C4	RGB 60 201 196	#3CC9C4
33.3%	33.3% #30C2BC	RGB 48 194 188	#30C2BC
50.0%	50.0% #24BBB5	RGB 36 187 181	#24BBB5
66.7%	66.7% #18B4AD	RGB 24 180 173	#18B4AD
83.3%	83.3% #0CADA5	RGB 12 173 165	#0CADA5
100.0%	100.0% #00A69E	RGB 0 166 158	#00A69E

#48D1CC #3CC9C4 #30C2BC #24BBB5 #18B4AD #0CADA5 #00A69E

#48D1CC - #00A69E

HSV Blend

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

0.0%	0.0% #48D1CC	RGB 72 209 204	#48D1CC
16.7%	16.7% #39C9C4	RGB 57 201 196	#39C9C4
33.3%	33.3% #2CC2BC	RGB 44 194 188	#2CC2BC
50.0%	50.0% #20BBB4	RGB 32 187 180	#20BBB4
66.7%	66.7% #14B4AD	RGB 20 180 173	#14B4AD
83.3%	83.3% #09ADA5	RGB 9 173 165	#09ADA5
100.0%	100.0% #00A69E	RGB 0 166 158	#00A69E

#48D1CC #39C9C4 #2CC2BC #20BBB4 #14B4AD #09ADA5 #00A69E

#48D1CC - #20BBB4 - #00A69E

CSS codes

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

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