#48D1CC - #CAF1F0 | 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 #CAF1F0

#48D1CC #CAF1F0

Calculate the color between two colors, #48D1CC and #CAF1F0. 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 - #CAF1F0 | 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 #CAF1F0 as 100%.

0.0%	0.0% #48D1CC	RGB 72 209 204	#48D1CC
16.7%	16.7% #5DD6D2	RGB 93 214 210	#5DD6D2
33.3%	33.3% #73DBD8	RGB 115 219 216	#73DBD8
50.0%	50.0% #89E1DE	RGB 137 225 222	#89E1DE
66.7%	66.7% #9EE6E4	RGB 158 230 228	#9EE6E4
83.3%	83.3% #B4EBEA	RGB 180 235 234	#B4EBEA
100.0%	100.0% #CAF1F0	RGB 202 241 240	#CAF1F0

#48D1CC #5DD6D2 #73DBD8 #89E1DE #9EE6E4 #B4EBEA #CAF1F0

#48D1CC - #CAF1F0

HSV Blend

#48D1CC - #CAF1F0 | 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 #CAF1F0 as 100%.

0.0%	0.0% #48D1CC	RGB 72 209 204	#48D1CC
16.7%	16.7% #5BD6D2	RGB 91 214 210	#5BD6D2
33.3%	33.3% #6FDBD8	RGB 111 219 216	#6FDBD8
50.0%	50.0% #85E1DE	RGB 133 225 222	#85E1DE
66.7%	66.7% #9BE6E4	RGB 155 230 228	#9BE6E4
83.3%	83.3% #B2EBEA	RGB 178 235 234	#B2EBEA
100.0%	100.0% #CAF1F0	RGB 202 241 240	#CAF1F0

#48D1CC #5BD6D2 #6FDBD8 #85E1DE #9BE6E4 #B2EBEA #CAF1F0

#48D1CC - #85E1DE - #CAF1F0

CSS codes

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

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