#CC3E45 - #FF8D4D | 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 #CC3E45 to #FF8D4D

#CC3E45 #FF8D4D

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

#CC3E45 - #FF8D4D | 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 #CC3E45 as 0% and #FF8D4D as 100%.

0.0%	0.0% #CC3E45	RGB 204 62 69	#CC3E45
16.7%	16.7% #D44B46	RGB 212 75 70	#D44B46
33.3%	33.3% #DD5847	RGB 221 88 71	#DD5847
50.0%	50.0% #E56549	RGB 229 101 73	#E56549
66.7%	66.7% #EE724A	RGB 238 114 74	#EE724A
83.3%	83.3% #F67F4B	RGB 246 127 75	#F67F4B
100.0%	100.0% #FF8D4D	RGB 255 141 77	#FF8D4D

#CC3E45 #D44B46 #DD5847 #E56549 #EE724A #F67F4B #FF8D4D

#CC3E45 - #FF8D4D

HSV Blend

#CC3E45 - #FF8D4D | 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 #CC3E45 as 0% and #FF8D4D as 100%.

0.0%	0.0% #CC3E45	RGB 204 62 69	#CC3E45
16.7%	16.7% #D44340	RGB 212 67 64	#D44340
33.3%	33.3% #DD5043	RGB 221 80 67	#DD5043
50.0%	50.0% #E55E45	RGB 229 94 69	#E55E45
66.7%	66.7% #EE6D48	RGB 238 109 72	#EE6D48
83.3%	83.3% #F67C4A	RGB 246 124 74	#F67C4A
100.0%	100.0% #FF8D4D	RGB 255 141 77	#FF8D4D

#CC3E45 #D44340 #DD5043 #E55E45 #EE6D48 #F67C4A #FF8D4D

#CC3E45 - #E55E45 - #FF8D4D

CSS codes

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

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