#FF5A5E - #FFBA6D | 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 #FF5A5E to #FFBA6D

#FF5A5E #FFBA6D

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

#FF5A5E - #FFBA6D | 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 #FF5A5E as 0% and #FFBA6D as 100%.

0.0%	0.0% #FF5A5E	RGB 255 90 94	#FF5A5E
16.7%	16.7% #FF6A60	RGB 255 106 96	#FF6A60
33.3%	33.3% #FF7A63	RGB 255 122 99	#FF7A63
50.0%	50.0% #FF8A65	RGB 255 138 101	#FF8A65
66.7%	66.7% #FF9A68	RGB 255 154 104	#FF9A68
83.3%	83.3% #FFAA6A	RGB 255 170 106	#FFAA6A
100.0%	100.0% #FFBA6D	RGB 255 186 109	#FFBA6D

#FF5A5E #FF6A60 #FF7A63 #FF8A65 #FF9A68 #FFAA6A #FFBA6D

#FF5A5E - #FFBA6D

HSV Blend

#FF5A5E - #FFBA6D | 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 #FF5A5E as 0% and #FFBA6D as 100%.

0.0%	0.0% #FF595E	RGB 255 89 94	#FF595E
16.7%	16.7% #FF685D	RGB 255 104 93	#FF685D
33.3%	33.3% #FF7960	RGB 255 121 96	#FF7960
50.0%	50.0% #FF8A63	RGB 255 138 99	#FF8A63
66.7%	66.7% #FF9A66	RGB 255 154 102	#FF9A66
83.3%	83.3% #FFAA69	RGB 255 170 105	#FFAA69
100.0%	100.0% #FFBA6D	RGB 255 186 109	#FFBA6D

#FF595E #FF685D #FF7960 #FF8A63 #FF9A66 #FFAA69 #FFBA6D

#FF5A5E - #FF8A63 - #FFBA6D

CSS codes

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

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