#ABCFC1 - #48988C | 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 #ABCFC1 to #48988C

#ABCFC1 #48988C

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

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

0.0%	0.0% #ABCFC1	RGB 171 207 193	#ABCFC1
16.7%	16.7% #9AC5B8	RGB 154 197 184	#9AC5B8
33.3%	33.3% #8ABCAF	RGB 138 188 175	#8ABCAF
50.0%	50.0% #79B3A6	RGB 121 179 166	#79B3A6
66.7%	66.7% #69AA9D	RGB 105 170 157	#69AA9D
83.3%	83.3% #58A194	RGB 88 161 148	#58A194
100.0%	100.0% #48988C	RGB 72 152 140	#48988C

#ABCFC1 #9AC5B8 #8ABCAF #79B3A6 #69AA9D #58A194 #48988C

#ABCFC1 - #48988C

HSV Blend

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

0.0%	0.0% #ABCFC1	RGB 171 207 193	#ABCFC1
16.7%	16.7% #97C5B5	RGB 151 197 181	#97C5B5
33.3%	33.3% #85BCAB	RGB 133 188 171	#85BCAB
50.0%	50.0% #74B3A2	RGB 116 179 162	#74B3A2
66.7%	66.7% #64AA9A	RGB 100 170 154	#64AA9A
83.3%	83.3% #55A192	RGB 85 161 146	#55A192
100.0%	100.0% #48988C	RGB 72 152 140	#48988C

#ABCFC1 #97C5B5 #85BCAB #74B3A2 #64AA9A #55A192 #48988C

#ABCFC1 - #74B3A2 - #48988C

CSS codes

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

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