#ABCEC1 - #48978C | 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 #ABCEC1 to #48978C

#ABCEC1 #48978C

Calculate the color between two colors, #ABCEC1 and #48978C. 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)

#ABCEC1 - #48978C | 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 #ABCEC1 as 0% and #48978C as 100%.

0.0%	0.0% #ABCEC1	RGB 171 206 193	#ABCEC1
16.7%	16.7% #9AC4B8	RGB 154 196 184	#9AC4B8
33.3%	33.3% #8ABBAF	RGB 138 187 175	#8ABBAF
50.0%	50.0% #79B2A6	RGB 121 178 166	#79B2A6
66.7%	66.7% #69A99D	RGB 105 169 157	#69A99D
83.3%	83.3% #58A094	RGB 88 160 148	#58A094
100.0%	100.0% #48978C	RGB 72 151 140	#48978C

#ABCEC1 #9AC4B8 #8ABBAF #79B2A6 #69A99D #58A094 #48978C

#ABCEC1 - #48978C

HSV Blend

#ABCEC1 - #48978C | 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 #ABCEC1 as 0% and #48978C as 100%.

0.0%	0.0% #ABCEC1	RGB 171 206 193	#ABCEC1
16.7%	16.7% #97C4B5	RGB 151 196 181	#97C4B5
33.3%	33.3% #85BBAB	RGB 133 187 171	#85BBAB
50.0%	50.0% #74B2A2	RGB 116 178 162	#74B2A2
66.7%	66.7% #64A99A	RGB 100 169 154	#64A99A
83.3%	83.3% #55A092	RGB 85 160 146	#55A092
100.0%	100.0% #48978C	RGB 72 151 140	#48978C

#ABCEC1 #97C4B5 #85BBAB #74B2A2 #64A99A #55A092 #48978C

#ABCEC1 - #74B2A2 - #48978C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ABCEC1 0%, #74B2A2 50%, #48978C 100%);
    background: -webkit-linear-gradient(top, #ABCEC1 0%, #74B2A2 50%, #48978C 100%);
    background: linear-gradient(to bottom, #ABCEC1 0%, #74B2A2 50%, #48978C 100%);
}
</style>