#4C5E6C - #AFA394 | 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 #4C5E6C to #AFA394

#4C5E6C #AFA394

Calculate the color between two colors, #4C5E6C and #AFA394. 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)

#4C5E6C - #AFA394 | 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 #4C5E6C as 0% and #AFA394 as 100%.

0.0%	0.0% #4C5E6C	RGB 76 94 108	#4C5E6C
16.7%	16.7% #5C6972	RGB 92 105 114	#5C6972
33.3%	33.3% #6D7579	RGB 109 117 121	#6D7579
50.0%	50.0% #7D8080	RGB 125 128 128	#7D8080
66.7%	66.7% #8E8C86	RGB 142 140 134	#8E8C86
83.3%	83.3% #9E978D	RGB 158 151 141	#9E978D
100.0%	100.0% #AFA394	RGB 175 163 148	#AFA394

#4C5E6C #5C6972 #6D7579 #7D8080 #8E8C86 #9E978D #AFA394

#4C5E6C - #AFA394

HSV Blend

#4C5E6C - #AFA394 | 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 #4C5E6C as 0% and #AFA394 as 100%.

0.0%	0.0% #4C5E6C	RGB 76 94 108	#4C5E6C
16.7%	16.7% #567775	RGB 86 119 117	#567775
33.3%	33.3% #618271	RGB 97 130 113	#618271
50.0%	50.0% #6D8D6D	RGB 109 141 109	#6D8D6D
66.7%	66.7% #889879	RGB 136 152 121	#889879
83.3%	83.3% #A2A386	RGB 162 163 134	#A2A386
100.0%	100.0% #AFA394	RGB 175 163 148	#AFA394

#4C5E6C #567775 #618271 #6D8D6D #889879 #A2A386 #AFA394

#4C5E6C - #6D8D6D - #AFA394

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4C5E6C 0%, #6D8D6D 50%, #AFA394 100%);
    background: -webkit-linear-gradient(top, #4C5E6C 0%, #6D8D6D 50%, #AFA394 100%);
    background: linear-gradient(to bottom, #4C5E6C 0%, #6D8D6D 50%, #AFA394 100%);
}
</style>