#AFB2B2 - #467877 | 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 #AFB2B2 to #467877

#AFB2B2 #467877

Calculate the color between two colors, #AFB2B2 and #467877. 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)

#AFB2B2 - #467877 | 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 #AFB2B2 as 0% and #467877 as 100%.

0.0%	0.0% #AFB2B2	RGB 175 178 178	#AFB2B2
16.7%	16.7% #9DA8A8	RGB 157 168 168	#9DA8A8
33.3%	33.3% #8C9E9E	RGB 140 158 158	#8C9E9E
50.0%	50.0% #7A9594	RGB 122 149 148	#7A9594
66.7%	66.7% #698B8A	RGB 105 139 138	#698B8A
83.3%	83.3% #578180	RGB 87 129 128	#578180
100.0%	100.0% #467877	RGB 70 120 119	#467877

#AFB2B2 #9DA8A8 #8C9E9E #7A9594 #698B8A #578180 #467877

#AFB2B2 - #467877

HSV Blend

#AFB2B2 - #467877 | 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 #AFB2B2 as 0% and #467877 as 100%.

0.0%	0.0% #AFB2B2	RGB 175 178 178	#AFB2B2
16.7%	16.7% #9AA8A8	RGB 154 168 168	#9AA8A8
33.3%	33.3% #869E9E	RGB 134 158 158	#869E9E
50.0%	50.0% #749594	RGB 116 149 148	#749594
66.7%	66.7% #638B8A	RGB 99 139 138	#638B8A
83.3%	83.3% #548180	RGB 84 129 128	#548180
100.0%	100.0% #467877	RGB 70 120 119	#467877

#AFB2B2 #9AA8A8 #869E9E #749594 #638B8A #548180 #467877

#AFB2B2 - #749594 - #467877

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AFB2B2 0%, #749594 50%, #467877 100%);
    background: -webkit-linear-gradient(top, #AFB2B2 0%, #749594 50%, #467877 100%);
    background: linear-gradient(to bottom, #AFB2B2 0%, #749594 50%, #467877 100%);
}
</style>