#DD5D3E - #FFAF53 | 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 #DD5D3E to #FFAF53

#DD5D3E #FFAF53

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

#DD5D3E - #FFAF53 | 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 #DD5D3E as 0% and #FFAF53 as 100%.

0.0%	0.0% #DD5D3E	RGB 221 93 62	#DD5D3E
16.7%	16.7% #E26A41	RGB 226 106 65	#E26A41
33.3%	33.3% #E87845	RGB 232 120 69	#E87845
50.0%	50.0% #EE8648	RGB 238 134 72	#EE8648
66.7%	66.7% #F3934C	RGB 243 147 76	#F3934C
83.3%	83.3% #F9A14F	RGB 249 161 79	#F9A14F
100.0%	100.0% #FFAF53	RGB 255 175 83	#FFAF53

#DD5D3E #E26A41 #E87845 #EE8648 #F3934C #F9A14F #FFAF53

#DD5D3E - #FFAF53

HSV Blend

#DD5D3E - #FFAF53 | 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 #DD5D3E as 0% and #FFAF53 as 100%.

0.0%	0.0% #DD5D3E	RGB 221 93 62	#DD5D3E
16.7%	16.7% #E26941	RGB 226 105 65	#E26941
33.3%	33.3% #E87744	RGB 232 119 68	#E87744
50.0%	50.0% #EE8448	RGB 238 132 72	#EE8448
66.7%	66.7% #F3924B	RGB 243 146 75	#F3924B
83.3%	83.3% #F9A04F	RGB 249 160 79	#F9A04F
100.0%	100.0% #FFAF53	RGB 255 175 83	#FFAF53

#DD5D3E #E26941 #E87744 #EE8448 #F3924B #F9A04F #FFAF53

#DD5D3E - #EE8448 - #FFAF53

CSS codes

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

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