#ED1F10 - #FF7006 | 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 #ED1F10 to #FF7006

#ED1F10 #FF7006

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

#ED1F10 - #FF7006 | 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 #ED1F10 as 0% and #FF7006 as 100%.

0.0%	0.0% #ED1F10	RGB 237 31 16	#ED1F10
16.7%	16.7% #F02C0E	RGB 240 44 14	#F02C0E
33.3%	33.3% #F33A0C	RGB 243 58 12	#F33A0C
50.0%	50.0% #F6470B	RGB 246 71 11	#F6470B
66.7%	66.7% #F95509	RGB 249 85 9	#F95509
83.3%	83.3% #FC6207	RGB 252 98 7	#FC6207
100.0%	100.0% #FF7006	RGB 255 112 6	#FF7006

#ED1F10 #F02C0E #F33A0C #F6470B #F95509 #FC6207 #FF7006

#ED1F10 - #FF7006

HSV Blend

#ED1F10 - #FF7006 | 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 #ED1F10 as 0% and #FF7006 as 100%.

0.0%	0.0% #ED1F10	RGB 237 31 16	#ED1F10
16.7%	16.7% #F02B0E	RGB 240 43 14	#F02B0E
33.3%	33.3% #F3370C	RGB 243 55 12	#F3370C
50.0%	50.0% #F6450B	RGB 246 69 11	#F6450B
66.7%	66.7% #F95209	RGB 249 82 9	#F95209
83.3%	83.3% #FC6107	RGB 252 97 7	#FC6107
100.0%	100.0% #FF7006	RGB 255 112 6	#FF7006

#ED1F10 #F02B0E #F3370C #F6450B #F95209 #FC6107 #FF7006

#ED1F10 - #F6450B - #FF7006

CSS codes

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

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