#3C4A72 - #8F909C | 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 #3C4A72 to #8F909C

#3C4A72 #8F909C

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

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

0.0%	0.0% #3C4A72	RGB 60 74 114	#3C4A72
16.7%	16.7% #495579	RGB 73 85 121	#495579
33.3%	33.3% #576180	RGB 87 97 128	#576180
50.0%	50.0% #656D87	RGB 101 109 135	#656D87
66.7%	66.7% #73788E	RGB 115 120 142	#73788E
83.3%	83.3% #818495	RGB 129 132 149	#818495
100.0%	100.0% #8F909C	RGB 143 144 156	#8F909C

#3C4A72 #495579 #576180 #656D87 #73788E #818495 #8F909C

#3C4A72 - #8F909C

HSV Blend

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

0.0%	0.0% #3C4A72	RGB 60 74 114	#3C4A72
16.7%	16.7% #475279	RGB 71 82 121	#475279
33.3%	33.3% #545C80	RGB 84 92 128	#545C80
50.0%	50.0% #616787	RGB 97 103 135	#616787
66.7%	66.7% #6F738E	RGB 111 115 142	#6F738E
83.3%	83.3% #7E8195	RGB 126 129 149	#7E8195
100.0%	100.0% #8F909C	RGB 143 144 156	#8F909C

#3C4A72 #475279 #545C80 #616787 #6F738E #7E8195 #8F909C

#3C4A72 - #616787 - #8F909C

CSS codes

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

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