#3C4876 - #8C8EA0 | 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 #3C4876 to #8C8EA0

#3C4876 #8C8EA0

Calculate the color between two colors, #3C4876 and #8C8EA0. 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)

#3C4876 - #8C8EA0 | 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 #3C4876 as 0% and #8C8EA0 as 100%.

0.0%	0.0% #3C4876	RGB 60 72 118	#3C4876
16.7%	16.7% #49537D	RGB 73 83 125	#49537D
33.3%	33.3% #565F84	RGB 86 95 132	#565F84
50.0%	50.0% #646B8B	RGB 100 107 139	#646B8B
66.7%	66.7% #717692	RGB 113 118 146	#717692
83.3%	83.3% #7E8299	RGB 126 130 153	#7E8299
100.0%	100.0% #8C8EA0	RGB 140 142 160	#8C8EA0

#3C4876 #49537D #565F84 #646B8B #717692 #7E8299 #8C8EA0

#3C4876 - #8C8EA0

HSV Blend

#3C4876 - #8C8EA0 | 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 #3C4876 as 0% and #8C8EA0 as 100%.

0.0%	0.0% #3C4876	RGB 60 72 118	#3C4876
16.7%	16.7% #47517D	RGB 71 81 125	#47517D
33.3%	33.3% #535B84	RGB 83 91 132	#535B84
50.0%	50.0% #60668B	RGB 96 102 139	#60668B
66.7%	66.7% #6D7292	RGB 109 114 146	#6D7292
83.3%	83.3% #7C7F99	RGB 124 127 153	#7C7F99
100.0%	100.0% #8C8EA0	RGB 140 142 160	#8C8EA0

#3C4876 #47517D #535B84 #60668B #6D7292 #7C7F99 #8C8EA0

#3C4876 - #60668B - #8C8EA0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C4876 0%, #60668B 50%, #8C8EA0 100%);
    background: -webkit-linear-gradient(top, #3C4876 0%, #60668B 50%, #8C8EA0 100%);
    background: linear-gradient(to bottom, #3C4876 0%, #60668B 50%, #8C8EA0 100%);
}
</style>