#CC622C - #FEAB3E | 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 #CC622C to #FEAB3E

#CC622C #FEAB3E

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

#CC622C - #FEAB3E | 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 #CC622C as 0% and #FEAB3E as 100%.

0.0%	0.0% #CC622C	RGB 204 98 44	#CC622C
16.7%	16.7% #D46E2F	RGB 212 110 47	#D46E2F
33.3%	33.3% #DC7A32	RGB 220 122 50	#DC7A32
50.0%	50.0% #E58635	RGB 229 134 53	#E58635
66.7%	66.7% #ED9238	RGB 237 146 56	#ED9238
83.3%	83.3% #F59E3B	RGB 245 158 59	#F59E3B
100.0%	100.0% #FEAB3E	RGB 254 171 62	#FEAB3E

#CC622C #D46E2F #DC7A32 #E58635 #ED9238 #F59E3B #FEAB3E

#CC622C - #FEAB3E

HSV Blend

#CC622C - #FEAB3E | 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 #CC622C as 0% and #FEAB3E as 100%.

0.0%	0.0% #CC622C	RGB 204 98 44	#CC622C
16.7%	16.7% #D46D2E	RGB 212 109 46	#D46D2E
33.3%	33.3% #DC7831	RGB 220 120 49	#DC7831
50.0%	50.0% #E58434	RGB 229 132 52	#E58434
66.7%	66.7% #ED9037	RGB 237 144 55	#ED9037
83.3%	83.3% #F59D3A	RGB 245 157 58	#F59D3A
100.0%	100.0% #FEAB3E	RGB 254 171 62	#FEAB3E

#CC622C #D46D2E #DC7831 #E58434 #ED9037 #F59D3A #FEAB3E

#CC622C - #E58434 - #FEAB3E

CSS codes

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

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