#3C3856 - #C48177 | 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 #3C3856 to #C48177

#3C3856 #C48177

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

#3C3856 - #C48177 | 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 #3C3856 as 0% and #C48177 as 100%.

0.0%	0.0% #3C3856	RGB 60 56 86	#3C3856
16.7%	16.7% #52445B	RGB 82 68 91	#52445B
33.3%	33.3% #695061	RGB 105 80 97	#695061
50.0%	50.0% #805C66	RGB 128 92 102	#805C66
66.7%	66.7% #96686C	RGB 150 104 108	#96686C
83.3%	83.3% #AD7471	RGB 173 116 113	#AD7471
100.0%	100.0% #C48177	RGB 196 129 119	#C48177

#3C3856 #52445B #695061 #805C66 #96686C #AD7471 #C48177

#3C3856 - #C48177

HSV Blend

#3C3856 - #C48177 | 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 #3C3856 as 0% and #C48177 as 100%.

0.0%	0.0% #3C3856	RGB 60 56 86	#3C3856
16.7%	16.7% #544368	RGB 84 67 104	#544368
33.3%	33.3% #714E7A	RGB 113 78 122	#714E7A
50.0%	50.0% #8D5886	RGB 141 88 134	#8D5886
66.7%	66.7% #9F6383	RGB 159 99 131	#9F6383
83.3%	83.3% #B16D7B	RGB 177 109 123	#B16D7B
100.0%	100.0% #C48177	RGB 196 129 119	#C48177

#3C3856 #544368 #714E7A #8D5886 #9F6383 #B16D7B #C48177

#3C3856 - #8D5886 - #C48177

CSS codes

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

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