#BA552B - #FEAF37 | 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 #BA552B to #FEAF37

#BA552B #FEAF37

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

#BA552B - #FEAF37 | 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 #BA552B as 0% and #FEAF37 as 100%.

0.0%	0.0% #BA552B	RGB 186 85 43	#BA552B
16.7%	16.7% #C5642D	RGB 197 100 45	#C5642D
33.3%	33.3% #D0732F	RGB 208 115 47	#D0732F
50.0%	50.0% #DC8231	RGB 220 130 49	#DC8231
66.7%	66.7% #E79133	RGB 231 145 51	#E79133
83.3%	83.3% #F2A035	RGB 242 160 53	#F2A035
100.0%	100.0% #FEAF37	RGB 254 175 55	#FEAF37

#BA552B #C5642D #D0732F #DC8231 #E79133 #F2A035 #FEAF37

#BA552B - #FEAF37

HSV Blend

#BA552B - #FEAF37 | 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 #BA552B as 0% and #FEAF37 as 100%.

0.0%	0.0% #BA552B	RGB 186 85 43	#BA552B
16.7%	16.7% #C5612D	RGB 197 97 45	#C5612D
33.3%	33.3% #D06F2F	RGB 208 111 47	#D06F2F
50.0%	50.0% #DC7D31	RGB 220 125 49	#DC7D31
66.7%	66.7% #E78D33	RGB 231 141 51	#E78D33
83.3%	83.3% #F29D35	RGB 242 157 53	#F29D35
100.0%	100.0% #FEAF37	RGB 254 175 55	#FEAF37

#BA552B #C5612D #D06F2F #DC7D31 #E78D33 #F29D35 #FEAF37

#BA552B - #DC7D31 - #FEAF37

CSS codes

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

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