#4A578C - #AFB2B0 | 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 #4A578C to #AFB2B0

#4A578C #AFB2B0

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

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

0.0%	0.0% #4A578C	RGB 74 87 140	#4A578C
16.7%	16.7% #5A6692	RGB 90 102 146	#5A6692
33.3%	33.3% #6B7598	RGB 107 117 152	#6B7598
50.0%	50.0% #7C849E	RGB 124 132 158	#7C849E
66.7%	66.7% #8D93A4	RGB 141 147 164	#8D93A4
83.3%	83.3% #9EA2AA	RGB 158 162 170	#9EA2AA
100.0%	100.0% #AFB2B0	RGB 175 178 176	#AFB2B0

#4A578C #5A6692 #6B7598 #7C849E #8D93A4 #9EA2AA #AFB2B0

#4A578C - #AFB2B0

HSV Blend

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

0.0%	0.0% #4A568C	RGB 74 86 140	#4A568C
16.7%	16.7% #587292	RGB 88 114 146	#587292
33.3%	33.3% #678998	RGB 103 137 152	#678998
50.0%	50.0% #789C9F	RGB 120 156 159	#789C9F
66.7%	66.7% #89A5A0	RGB 137 165 160	#89A5A0
83.3%	83.3% #9BABA4	RGB 155 171 164	#9BABA4
100.0%	100.0% #AFB2B0	RGB 175 178 176	#AFB2B0

#4A568C #587292 #678998 #789C9F #89A5A0 #9BABA4 #AFB2B0

#4A578C - #789C9F - #AFB2B0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4A568C 0%, #789C9F 50%, #AFB2B0 100%);
    background: -webkit-linear-gradient(top, #4A568C 0%, #789C9F 50%, #AFB2B0 100%);
    background: linear-gradient(to bottom, #4A568C 0%, #789C9F 50%, #AFB2B0 100%);
}
</style>