#503D64 - #8C8187 | 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 #503D64 to #8C8187

#503D64 #8C8187

Calculate the color between two colors, #503D64 and #8C8187. 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)

#503D64 - #8C8187 | 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 #503D64 as 0% and #8C8187 as 100%.

0.0%	0.0% #503D64	RGB 80 61 100	#503D64
16.7%	16.7% #5A4869	RGB 90 72 105	#5A4869
33.3%	33.3% #64536F	RGB 100 83 111	#64536F
50.0%	50.0% #6E5F75	RGB 110 95 117	#6E5F75
66.7%	66.7% #786A7B	RGB 120 106 123	#786A7B
83.3%	83.3% #827581	RGB 130 117 129	#827581
100.0%	100.0% #8C8187	RGB 140 129 135	#8C8187

#503D64 #5A4869 #64536F #6E5F75 #786A7B #827581 #8C8187

#503D64 - #8C8187

HSV Blend

#503D64 - #8C8187 | 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 #503D64 as 0% and #8C8187 as 100%.

0.0%	0.0% #503D64	RGB 80 61 100	#503D64
16.7%	16.7% #5D466A	RGB 93 70 106	#5D466A
33.3%	33.3% #6B5071	RGB 107 80 113	#6B5071
50.0%	50.0% #775B78	RGB 119 91 120	#775B78
66.7%	66.7% #7E677B	RGB 126 103 123	#7E677B
83.3%	83.3% #857380	RGB 133 115 128	#857380
100.0%	100.0% #8C8187	RGB 140 129 135	#8C8187

#503D64 #5D466A #6B5071 #775B78 #7E677B #857380 #8C8187

#503D64 - #775B78 - #8C8187

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #503D64 0%, #775B78 50%, #8C8187 100%);
    background: -webkit-linear-gradient(top, #503D64 0%, #775B78 50%, #8C8187 100%);
    background: linear-gradient(to bottom, #503D64 0%, #775B78 50%, #8C8187 100%);
}
</style>