#504A8C - #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 #504A8C to #AFB2B0

#504A8C #AFB2B0

Calculate the color between two colors, #504A8C 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)

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

0.0%	0.0% #504A8C	RGB 80 74 140	#504A8C
16.7%	16.7% #5F5B92	RGB 95 91 146	#5F5B92
33.3%	33.3% #6F6C98	RGB 111 108 152	#6F6C98
50.0%	50.0% #7F7E9E	RGB 127 126 158	#7F7E9E
66.7%	66.7% #8F8FA4	RGB 143 143 164	#8F8FA4
83.3%	83.3% #9FA0AA	RGB 159 160 170	#9FA0AA
100.0%	100.0% #AFB2B0	RGB 175 178 176	#AFB2B0

#504A8C #5F5B92 #6F6C98 #7F7E9E #8F8FA4 #9FA0AA #AFB2B0

#504A8C - #AFB2B0

HSV Blend

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

0.0%	0.0% #504A8C	RGB 80 74 140	#504A8C
16.7%	16.7% #586492	RGB 88 100 146	#586492
33.3%	33.3% #678098	RGB 103 128 152	#678098
50.0%	50.0% #78969F	RGB 120 150 159	#78969F
66.7%	66.7% #89A5A3	RGB 137 165 163	#89A5A3
83.3%	83.3% #9BABA5	RGB 155 171 165	#9BABA5
100.0%	100.0% #AFB2B0	RGB 175 178 176	#AFB2B0

#504A8C #586492 #678098 #78969F #89A5A3 #9BABA5 #AFB2B0

#504A8C - #78969F - #AFB2B0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #504A8C 0%, #78969F 50%, #AFB2B0 100%);
    background: -webkit-linear-gradient(top, #504A8C 0%, #78969F 50%, #AFB2B0 100%);
    background: linear-gradient(to bottom, #504A8C 0%, #78969F 50%, #AFB2B0 100%);
}
</style>