#48C0C2 - #ABC9FF | 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 #48C0C2 to #ABC9FF

#48C0C2 #ABC9FF

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

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

0.0%	0.0% #48C0C2	RGB 72 192 194	#48C0C2
16.7%	16.7% #58C1CC	RGB 88 193 204	#58C1CC
33.3%	33.3% #69C3D6	RGB 105 195 214	#69C3D6
50.0%	50.0% #79C4E0	RGB 121 196 224	#79C4E0
66.7%	66.7% #8AC6EA	RGB 138 198 234	#8AC6EA
83.3%	83.3% #9AC7F4	RGB 154 199 244	#9AC7F4
100.0%	100.0% #ABC9FF	RGB 171 201 255	#ABC9FF

#48C0C2 #58C1CC #69C3D6 #79C4E0 #8AC6EA #9AC7F4 #ABC9FF

#48C0C2 - #ABC9FF

HSV Blend

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

0.0%	0.0% #48C0C2	RGB 72 192 194	#48C0C2
16.7%	16.7% #55BDCC	RGB 85 189 204	#55BDCC
33.3%	33.3% #64BCD6	RGB 100 188 214	#64BCD6
50.0%	50.0% #74BDE0	RGB 116 189 224	#74BDE0
66.7%	66.7% #85BEEA	RGB 133 190 234	#85BEEA
83.3%	83.3% #97C2F4	RGB 151 194 244	#97C2F4
100.0%	100.0% #ABC9FF	RGB 171 201 255	#ABC9FF

#48C0C2 #55BDCC #64BCD6 #74BDE0 #85BEEA #97C2F4 #ABC9FF

#48C0C2 - #74BDE0 - #ABC9FF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #48C0C2 0%, #74BDE0 50%, #ABC9FF 100%);
    background: -webkit-linear-gradient(top, #48C0C2 0%, #74BDE0 50%, #ABC9FF 100%);
    background: linear-gradient(to bottom, #48C0C2 0%, #74BDE0 50%, #ABC9FF 100%);
}
</style>