#3C3C5E - #857C85 | 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 #3C3C5E to #857C85

#3C3C5E #857C85

Calculate the color between two colors, #3C3C5E and #857C85. 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)

#3C3C5E - #857C85 | 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 #3C3C5E as 0% and #857C85 as 100%.

0.0%	0.0% #3C3C5E	RGB 60 60 94	#3C3C5E
16.7%	16.7% #484664	RGB 72 70 100	#484664
33.3%	33.3% #54516B	RGB 84 81 107	#54516B
50.0%	50.0% #605C71	RGB 96 92 113	#605C71
66.7%	66.7% #6C6678	RGB 108 102 120	#6C6678
83.3%	83.3% #78717E	RGB 120 113 126	#78717E
100.0%	100.0% #857C85	RGB 133 124 133	#857C85

#3C3C5E #484664 #54516B #605C71 #6C6678 #78717E #857C85

#3C3C5E - #857C85

HSV Blend

#3C3C5E - #857C85 | 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 #3C3C5E as 0% and #857C85 as 100%.

0.0%	0.0% #3C3C5E	RGB 60 60 94	#3C3C5E
16.7%	16.7% #4A4564	RGB 74 69 100	#4A4564
33.3%	33.3% #584E6B	RGB 88 78 107	#584E6B
50.0%	50.0% #655971	RGB 101 89 113	#655971
66.7%	66.7% #716478	RGB 113 100 120	#716478
83.3%	83.3% #7C6F7E	RGB 124 111 126	#7C6F7E
100.0%	100.0% #857C85	RGB 133 124 133	#857C85

#3C3C5E #4A4564 #584E6B #655971 #716478 #7C6F7E #857C85

#3C3C5E - #655971 - #857C85

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C3C5E 0%, #655971 50%, #857C85 100%);
    background: -webkit-linear-gradient(top, #3C3C5E 0%, #655971 50%, #857C85 100%);
    background: linear-gradient(to bottom, #3C3C5E 0%, #655971 50%, #857C85 100%);
}
</style>