#AA3C20 - #F4802D | 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 #AA3C20 to #F4802D

#AA3C20 #F4802D

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

#AA3C20 - #F4802D | 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 #AA3C20 as 0% and #F4802D as 100%.

0.0%	0.0% #AA3C20	RGB 170 60 32	#AA3C20
16.7%	16.7% #B64722	RGB 182 71 34	#B64722
33.3%	33.3% #C25224	RGB 194 82 36	#C25224
50.0%	50.0% #CF5E26	RGB 207 94 38	#CF5E26
66.7%	66.7% #DB6928	RGB 219 105 40	#DB6928
83.3%	83.3% #E7742A	RGB 231 116 42	#E7742A
100.0%	100.0% #F4802D	RGB 244 128 45	#F4802D

#AA3C20 #B64722 #C25224 #CF5E26 #DB6928 #E7742A #F4802D

#AA3C20 - #F4802D

HSV Blend

#AA3C20 - #F4802D | 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 #AA3C20 as 0% and #F4802D as 100%.

0.0%	0.0% #AA3C1F	RGB 170 60 31	#AA3C1F
16.7%	16.7% #B64522	RGB 182 69 34	#B64522
33.3%	33.3% #C24F24	RGB 194 79 36	#C24F24
50.0%	50.0% #CF5A26	RGB 207 90 38	#CF5A26
66.7%	66.7% #DB6628	RGB 219 102 40	#DB6628
83.3%	83.3% #E7722A	RGB 231 114 42	#E7722A
100.0%	100.0% #F4802D	RGB 244 128 45	#F4802D

#AA3C1F #B64522 #C24F24 #CF5A26 #DB6628 #E7722A #F4802D

#AA3C20 - #CF5A26 - #F4802D

CSS codes

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

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