#FF5200 - #FFA200 | 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 #FF5200 to #FFA200

#FF5200 #FFA200

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

#FF5200 - #FFA200 | 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 #FF5200 as 0% and #FFA200 as 100%.

0.0%	0.0% #FF5200	RGB 255 82 0	#FF5200
16.7%	16.7% #FF5F00	RGB 255 95 0	#FF5F00
33.3%	33.3% #FF6C00	RGB 255 108 0	#FF6C00
50.0%	50.0% #FF7A00	RGB 255 122 0	#FF7A00
66.7%	66.7% #FF8700	RGB 255 135 0	#FF8700
83.3%	83.3% #FF9400	RGB 255 148 0	#FF9400
100.0%	100.0% #FFA200	RGB 255 162 0	#FFA200

#FF5200 #FF5F00 #FF6C00 #FF7A00 #FF8700 #FF9400 #FFA200

#FF5200 - #FFA200

HSV Blend

#FF5200 - #FFA200 | 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 #FF5200 as 0% and #FFA200 as 100%.

0.0%	0.0% #FF5200	RGB 255 82 0	#FF5200
16.7%	16.7% #FF5F00	RGB 255 95 0	#FF5F00
33.3%	33.3% #FF6C00	RGB 255 108 0	#FF6C00
50.0%	50.0% #FF7A00	RGB 255 122 0	#FF7A00
66.7%	66.7% #FF8700	RGB 255 135 0	#FF8700
83.3%	83.3% #FF9400	RGB 255 148 0	#FF9400
100.0%	100.0% #FFA200	RGB 255 162 0	#FFA200

#FF5200 #FF5F00 #FF6C00 #FF7A00 #FF8700 #FF9400 #FFA200

#FF5200 - #FF7A00 - #FFA200

CSS codes

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

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