#CC3E3A - #FF8F4B | 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 #CC3E3A to #FF8F4B

#CC3E3A #FF8F4B

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

#CC3E3A - #FF8F4B | 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 #CC3E3A as 0% and #FF8F4B as 100%.

0.0%	0.0% #CC3E3A	RGB 204 62 58	#CC3E3A
16.7%	16.7% #D44B3C	RGB 212 75 60	#D44B3C
33.3%	33.3% #DD593F	RGB 221 89 63	#DD593F
50.0%	50.0% #E56642	RGB 229 102 66	#E56642
66.7%	66.7% #EE7445	RGB 238 116 69	#EE7445
83.3%	83.3% #F68148	RGB 246 129 72	#F68148
100.0%	100.0% #FF8F4B	RGB 255 143 75	#FF8F4B

#CC3E3A #D44B3C #DD593F #E56642 #EE7445 #F68148 #FF8F4B

#CC3E3A - #FF8F4B

HSV Blend

#CC3E3A - #FF8F4B | 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 #CC3E3A as 0% and #FF8F4B as 100%.

0.0%	0.0% #CC3E3A	RGB 204 62 58	#CC3E3A
16.7%	16.7% #D4493C	RGB 212 73 60	#D4493C
33.3%	33.3% #DD563F	RGB 221 86 63	#DD563F
50.0%	50.0% #E56342	RGB 229 99 66	#E56342
66.7%	66.7% #EE7145	RGB 238 113 69	#EE7145
83.3%	83.3% #F67F48	RGB 246 127 72	#F67F48
100.0%	100.0% #FF8F4B	RGB 255 143 75	#FF8F4B

#CC3E3A #D4493C #DD563F #E56342 #EE7145 #F67F48 #FF8F4B

#CC3E3A - #E56342 - #FF8F4B

CSS codes

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

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