#CC3C00 - #FF8600 | 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 #CC3C00 to #FF8600

#CC3C00 #FF8600

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

#CC3C00 - #FF8600 | 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 #CC3C00 as 0% and #FF8600 as 100%.

0.0%	0.0% #CC3C00	RGB 204 60 0	#CC3C00
16.7%	16.7% #D44800	RGB 212 72 0	#D44800
33.3%	33.3% #DD5400	RGB 221 84 0	#DD5400
50.0%	50.0% #E56100	RGB 229 97 0	#E56100
66.7%	66.7% #EE6D00	RGB 238 109 0	#EE6D00
83.3%	83.3% #F67900	RGB 246 121 0	#F67900
100.0%	100.0% #FF8600	RGB 255 134 0	#FF8600

#CC3C00 #D44800 #DD5400 #E56100 #EE6D00 #F67900 #FF8600

#CC3C00 - #FF8600

HSV Blend

#CC3C00 - #FF8600 | 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 #CC3C00 as 0% and #FF8600 as 100%.

0.0%	0.0% #CC3C00	RGB 204 60 0	#CC3C00
16.7%	16.7% #D44600	RGB 212 70 0	#D44600
33.3%	33.3% #DD5200	RGB 221 82 0	#DD5200
50.0%	50.0% #E55E00	RGB 229 94 0	#E55E00
66.7%	66.7% #EE6A00	RGB 238 106 0	#EE6A00
83.3%	83.3% #F67800	RGB 246 120 0	#F67800
100.0%	100.0% #FF8600	RGB 255 134 0	#FF8600

#CC3C00 #D44600 #DD5200 #E55E00 #EE6A00 #F67800 #FF8600

#CC3C00 - #E55E00 - #FF8600

CSS codes

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

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