#3B3E5E - #877F86 | 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 #3B3E5E to #877F86

#3B3E5E #877F86

Calculate the color between two colors, #3B3E5E and #877F86. 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)

#3B3E5E - #877F86 | 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 #3B3E5E as 0% and #877F86 as 100%.

0.0%	0.0% #3B3E5E	RGB 59 62 94	#3B3E5E
16.7%	16.7% #474864	RGB 71 72 100	#474864
33.3%	33.3% #54536B	RGB 84 83 107	#54536B
50.0%	50.0% #615E72	RGB 97 94 114	#615E72
66.7%	66.7% #6D6978	RGB 109 105 120	#6D6978
83.3%	83.3% #7A747F	RGB 122 116 127	#7A747F
100.0%	100.0% #877F86	RGB 135 127 134	#877F86

#3B3E5E #474864 #54536B #615E72 #6D6978 #7A747F #877F86

#3B3E5E - #877F86

HSV Blend

#3B3E5E - #877F86 | 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 #3B3E5E as 0% and #877F86 as 100%.

0.0%	0.0% #3B3E5E	RGB 59 62 94	#3B3E5E
16.7%	16.7% #484464	RGB 72 68 100	#484464
33.3%	33.3% #574E6B	RGB 87 78 107	#574E6B
50.0%	50.0% #665972	RGB 102 89 114	#665972
66.7%	66.7% #736579	RGB 115 101 121	#736579
83.3%	83.3% #7F7180	RGB 127 113 128	#7F7180
100.0%	100.0% #877F86	RGB 135 127 134	#877F86

#3B3E5E #484464 #574E6B #665972 #736579 #7F7180 #877F86

#3B3E5E - #665972 - #877F86

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3B3E5E 0%, #665972 50%, #877F86 100%);
    background: -webkit-linear-gradient(top, #3B3E5E 0%, #665972 50%, #877F86 100%);
    background: linear-gradient(to bottom, #3B3E5E 0%, #665972 50%, #877F86 100%);
}
</style>