#AFC3A2 - #31372E | 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 #AFC3A2 to #31372E

#AFC3A2 #31372E

Calculate the color between two colors, #AFC3A2 and #31372E. 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)

#AFC3A2 - #31372E | 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 #AFC3A2 as 0% and #31372E as 100%.

0.0%	0.0% #AFC3A2	RGB 175 195 162	#AFC3A2
16.7%	16.7% #9AAB8E	RGB 154 171 142	#9AAB8E
33.3%	33.3% #85947B	RGB 133 148 123	#85947B
50.0%	50.0% #707D68	RGB 112 125 104	#707D68
66.7%	66.7% #5B6554	RGB 91 101 84	#5B6554
83.3%	83.3% #464E41	RGB 70 78 65	#464E41
100.0%	100.0% #31372E	RGB 49 55 46	#31372E

#AFC3A2 #9AAB8E #85947B #707D68 #5B6554 #464E41 #31372E

#AFC3A2 - #31372E

HSV Blend

#AFC3A2 - #31372E | 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 #AFC3A2 as 0% and #31372E as 100%.

0.0%	0.0% #AFC3A2	RGB 175 195 162	#AFC3A2
16.7%	16.7% #99AB8E	RGB 153 171 142	#99AB8E
33.3%	33.3% #84947B	RGB 132 148 123	#84947B
50.0%	50.0% #6F7D68	RGB 111 125 104	#6F7D68
66.7%	66.7% #5A6554	RGB 90 101 84	#5A6554
83.3%	83.3% #454E41	RGB 69 78 65	#454E41
100.0%	100.0% #31372E	RGB 49 55 46	#31372E

#AFC3A2 #99AB8E #84947B #6F7D68 #5A6554 #454E41 #31372E

#AFC3A2 - #6F7D68 - #31372E

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AFC3A2 0%, #6F7D68 50%, #31372E 100%);
    background: -webkit-linear-gradient(top, #AFC3A2 0%, #6F7D68 50%, #31372E 100%);
    background: linear-gradient(to bottom, #AFC3A2 0%, #6F7D68 50%, #31372E 100%);
}
</style>