#554E5E - #E4B877 | 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 #554E5E to #E4B877

#554E5E #E4B877

Calculate the color between two colors, #554E5E and #E4B877. 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)

#554E5E - #E4B877 | 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 #554E5E as 0% and #E4B877 as 100%.

0.0%	0.0% #554E5E	RGB 85 78 94	#554E5E
16.7%	16.7% #6C5F62	RGB 108 95 98	#6C5F62
33.3%	33.3% #847166	RGB 132 113 102	#847166
50.0%	50.0% #9C836A	RGB 156 131 106	#9C836A
66.7%	66.7% #B4946E	RGB 180 148 110	#B4946E
83.3%	83.3% #CCA672	RGB 204 166 114	#CCA672
100.0%	100.0% #E4B877	RGB 228 184 119	#E4B877

#554E5E #6C5F62 #847166 #9C836A #B4946E #CCA672 #E4B877

#554E5E - #E4B877

HSV Blend

#554E5E - #E4B877 | 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 #554E5E as 0% and #E4B877 as 100%.

0.0%	0.0% #554E5E	RGB 85 78 94	#554E5E
16.7%	16.7% #6F5A74	RGB 111 90 116	#6F5A74
33.3%	33.3% #8A6484	RGB 138 100 132	#8A6484
50.0%	50.0% #A16C86	RGB 161 108 134	#A16C86
66.7%	66.7% #B7727A	RGB 183 114 122	#B7727A
83.3%	83.3% #CD8A75	RGB 205 138 117	#CD8A75
100.0%	100.0% #E4B877	RGB 228 184 119	#E4B877

#554E5E #6F5A74 #8A6484 #A16C86 #B7727A #CD8A75 #E4B877

#554E5E - #A16C86 - #E4B877

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #554E5E 0%, #A16C86 50%, #E4B877 100%);
    background: -webkit-linear-gradient(top, #554E5E 0%, #A16C86 50%, #E4B877 100%);
    background: linear-gradient(to bottom, #554E5E 0%, #A16C86 50%, #E4B877 100%);
}
</style>