#AF5E40 - #FAA759 | 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 #AF5E40 to #FAA759

#AF5E40 #FAA759

Calculate the color between two colors, #AF5E40 and #FAA759. 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)

#AF5E40 - #FAA759 | 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 #AF5E40 as 0% and #FAA759 as 100%.

0.0%	0.0% #AF5E40	RGB 175 94 64	#AF5E40
16.7%	16.7% #BB6A44	RGB 187 106 68	#BB6A44
33.3%	33.3% #C87648	RGB 200 118 72	#C87648
50.0%	50.0% #D4824C	RGB 212 130 76	#D4824C
66.7%	66.7% #E18E50	RGB 225 142 80	#E18E50
83.3%	83.3% #ED9A54	RGB 237 154 84	#ED9A54
100.0%	100.0% #FAA759	RGB 250 167 89	#FAA759

#AF5E40 #BB6A44 #C87648 #D4824C #E18E50 #ED9A54 #FAA759

#AF5E40 - #FAA759

HSV Blend

#AF5E40 - #FAA759 | 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 #AF5E40 as 0% and #FAA759 as 100%.

0.0%	0.0% #AF5E40	RGB 175 94 64	#AF5E40
16.7%	16.7% #BB6844	RGB 187 104 68	#BB6844
33.3%	33.3% #C87448	RGB 200 116 72	#C87448
50.0%	50.0% #D47F4C	RGB 212 127 76	#D47F4C
66.7%	66.7% #E18C50	RGB 225 140 80	#E18C50
83.3%	83.3% #ED9954	RGB 237 153 84	#ED9954
100.0%	100.0% #FAA759	RGB 250 167 89	#FAA759

#AF5E40 #BB6844 #C87448 #D47F4C #E18C50 #ED9954 #FAA759

#AF5E40 - #D47F4C - #FAA759

CSS codes

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

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