#AFB9BA - #4B6E7E | 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 #AFB9BA to #4B6E7E

#AFB9BA #4B6E7E

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

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

0.0%	0.0% #AFB9BA	RGB 175 185 186	#AFB9BA
16.7%	16.7% #9EACB0	RGB 158 172 176	#9EACB0
33.3%	33.3% #8DA0A6	RGB 141 160 166	#8DA0A6
50.0%	50.0% #7D939C	RGB 125 147 156	#7D939C
66.7%	66.7% #6C8792	RGB 108 135 146	#6C8792
83.3%	83.3% #5B7A88	RGB 91 122 136	#5B7A88
100.0%	100.0% #4B6E7E	RGB 75 110 126	#4B6E7E

#AFB9BA #9EACB0 #8DA0A6 #7D939C #6C8792 #5B7A88 #4B6E7E

#AFB9BA - #4B6E7E

HSV Blend

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

0.0%	0.0% #AFB9BA	RGB 175 185 186	#AFB9BA
16.7%	16.7% #9BADB0	RGB 155 173 176	#9BADB0
33.3%	33.3% #89A1A6	RGB 137 161 166	#89A1A6
50.0%	50.0% #77949C	RGB 119 148 156	#77949C
66.7%	66.7% #678792	RGB 103 135 146	#678792
83.3%	83.3% #587A88	RGB 88 122 136	#587A88
100.0%	100.0% #4B6E7E	RGB 75 110 126	#4B6E7E

#AFB9BA #9BADB0 #89A1A6 #77949C #678792 #587A88 #4B6E7E

#AFB9BA - #77949C - #4B6E7E

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AFB9BA 0%, #77949C 50%, #4B6E7E 100%);
    background: -webkit-linear-gradient(top, #AFB9BA 0%, #77949C 50%, #4B6E7E 100%);
    background: linear-gradient(to bottom, #AFB9BA 0%, #77949C 50%, #4B6E7E 100%);
}
</style>