#ABC3C0 - #4B677B | 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 #ABC3C0 to #4B677B

#ABC3C0 #4B677B

Calculate the color between two colors, #ABC3C0 and #4B677B. 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)

#ABC3C0 - #4B677B | 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 #ABC3C0 as 0% and #4B677B as 100%.

0.0%	0.0% #ABC3C0	RGB 171 195 192	#ABC3C0
16.7%	16.7% #9BB3B4	RGB 155 179 180	#9BB3B4
33.3%	33.3% #8BA4A9	RGB 139 164 169	#8BA4A9
50.0%	50.0% #7B959D	RGB 123 149 157	#7B959D
66.7%	66.7% #6B8592	RGB 107 133 146	#6B8592
83.3%	83.3% #5B7686	RGB 91 118 134	#5B7686
100.0%	100.0% #4B677B	RGB 75 103 123	#4B677B

#ABC3C0 #9BB3B4 #8BA4A9 #7B959D #6B8592 #5B7686 #4B677B

#ABC3C0 - #4B677B

HSV Blend

#ABC3C0 - #4B677B | 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 #ABC3C0 as 0% and #4B677B as 100%.

0.0%	0.0% #ABC3C0	RGB 171 195 192	#ABC3C0
16.7%	16.7% #98B7B5	RGB 152 183 181	#98B7B5
33.3%	33.3% #86A8AB	RGB 134 168 171	#86A8AB
50.0%	50.0% #76999F	RGB 118 153 159	#76999F
66.7%	66.7% #668893	RGB 102 136 147	#668893
83.3%	83.3% #587787	RGB 88 119 135	#587787
100.0%	100.0% #4B677B	RGB 75 103 123	#4B677B

#ABC3C0 #98B7B5 #86A8AB #76999F #668893 #587787 #4B677B

#ABC3C0 - #76999F - #4B677B

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ABC3C0 0%, #76999F 50%, #4B677B 100%);
    background: -webkit-linear-gradient(top, #ABC3C0 0%, #76999F 50%, #4B677B 100%);
    background: linear-gradient(to bottom, #ABC3C0 0%, #76999F 50%, #4B677B 100%);
}
</style>