#504A8C - #AFB2B1 | 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 #AFB2B1

#504A8C #AFB2B1

Calculate the color between two colors, #504A8C and #AFB2B1. 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 - #AFB2B1 | 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 #AFB2B1 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% #AFB2B1	RGB 175 178 177	#AFB2B1

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

#504A8C - #AFB2B1

HSV Blend

#504A8C - #AFB2B1 | 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 #AFB2B1 as 100%.

0.0%	0.0% #504A8C	RGB 80 74 140	#504A8C
16.7%	16.7% #586092	RGB 88 96 146	#586092
33.3%	33.3% #677A98	RGB 103 122 152	#677A98
50.0%	50.0% #78909F	RGB 120 144 159	#78909F
66.7%	66.7% #89A1A5	RGB 137 161 165	#89A1A5
83.3%	83.3% #9BABAA	RGB 155 171 170	#9BABAA
100.0%	100.0% #AFB2B1	RGB 175 178 177	#AFB2B1

#504A8C #586092 #677A98 #78909F #89A1A5 #9BABAA #AFB2B1

#504A8C - #78909F - #AFB2B1

CSS codes

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

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