#FF5B5C - #FFBA6A | 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 #FF5B5C to #FFBA6A

#FF5B5C #FFBA6A

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

#FF5B5C - #FFBA6A | 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 #FF5B5C as 0% and #FFBA6A as 100%.

0.0%	0.0% #FF5B5C	RGB 255 91 92	#FF5B5C
16.7%	16.7% #FF6A5E	RGB 255 106 94	#FF6A5E
33.3%	33.3% #FF7A60	RGB 255 122 96	#FF7A60
50.0%	50.0% #FF8A63	RGB 255 138 99	#FF8A63
66.7%	66.7% #FF9A65	RGB 255 154 101	#FF9A65
83.3%	83.3% #FFAA67	RGB 255 170 103	#FFAA67
100.0%	100.0% #FFBA6A	RGB 255 186 106	#FFBA6A

#FF5B5C #FF6A5E #FF7A60 #FF8A63 #FF9A65 #FFAA67 #FFBA6A

#FF5B5C - #FFBA6A

HSV Blend

#FF5B5C - #FFBA6A | 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 #FF5B5C as 0% and #FFBA6A as 100%.

0.0%	0.0% #FF5B5C	RGB 255 91 92	#FF5B5C
16.7%	16.7% #FF6B5D	RGB 255 107 93	#FF6B5D
33.3%	33.3% #FF7B60	RGB 255 123 96	#FF7B60
50.0%	50.0% #FF8C62	RGB 255 140 98	#FF8C62
66.7%	66.7% #FF9B65	RGB 255 155 101	#FF9B65
83.3%	83.3% #FFAB67	RGB 255 171 103	#FFAB67
100.0%	100.0% #FFBA6A	RGB 255 186 106	#FFBA6A

#FF5B5C #FF6B5D #FF7B60 #FF8C62 #FF9B65 #FFAB67 #FFBA6A

#FF5B5C - #FF8C62 - #FFBA6A

CSS codes

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

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