#FFAF59 - #B0550E | 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 #FFAF59 to #B0550E

#FFAF59 #B0550E

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

#FFAF59 - #B0550E | 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 #FFAF59 as 0% and #B0550E as 100%.

0.0%	0.0% #FFAF59	RGB 255 175 89	#FFAF59
16.7%	16.7% #F1A04C	RGB 241 160 76	#F1A04C
33.3%	33.3% #E49140	RGB 228 145 64	#E49140
50.0%	50.0% #D78233	RGB 215 130 51	#D78233
66.7%	66.7% #CA7327	RGB 202 115 39	#CA7327
83.3%	83.3% #BD641A	RGB 189 100 26	#BD641A
100.0%	100.0% #B0550E	RGB 176 85 14	#B0550E

#FFAF59 #F1A04C #E49140 #D78233 #CA7327 #BD641A #B0550E

#FFAF59 - #B0550E

HSV Blend

#FFAF59 - #B0550E | 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 #FFAF59 as 0% and #B0550E as 100%.

0.0%	0.0% #FFAF59	RGB 255 175 89	#FFAF59
16.7%	16.7% #F19E49	RGB 241 158 73	#F19E49
33.3%	33.3% #E48E3B	RGB 228 142 59	#E48E3B
50.0%	50.0% #D77F2E	RGB 215 127 46	#D77F2E
66.7%	66.7% #CA7022	RGB 202 112 34	#CA7022
83.3%	83.3% #BD6217	RGB 189 98 23	#BD6217
100.0%	100.0% #B0550E	RGB 176 85 14	#B0550E

#FFAF59 #F19E49 #E48E3B #D77F2E #CA7022 #BD6217 #B0550E

#FFAF59 - #D77F2E - #B0550E

CSS codes

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

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