#CA5E4A - #FFAE63 | 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 #CA5E4A to #FFAE63

#CA5E4A #FFAE63

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

#CA5E4A - #FFAE63 | 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 #CA5E4A as 0% and #FFAE63 as 100%.

0.0%	0.0% #CA5E4A	RGB 202 94 74	#CA5E4A
16.7%	16.7% #D26B4E	RGB 210 107 78	#D26B4E
33.3%	33.3% #DB7852	RGB 219 120 82	#DB7852
50.0%	50.0% #E48656	RGB 228 134 86	#E48656
66.7%	66.7% #ED935A	RGB 237 147 90	#ED935A
83.3%	83.3% #F6A05E	RGB 246 160 94	#F6A05E
100.0%	100.0% #FFAE63	RGB 255 174 99	#FFAE63

#CA5E4A #D26B4E #DB7852 #E48656 #ED935A #F6A05E #FFAE63

#CA5E4A - #FFAE63

HSV Blend

#CA5E4A - #FFAE63 | 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 #CA5E4A as 0% and #FFAE63 as 100%.

0.0%	0.0% #CA5E4A	RGB 202 94 74	#CA5E4A
16.7%	16.7% #D2694E	RGB 210 105 78	#D2694E
33.3%	33.3% #DB7652	RGB 219 118 82	#DB7652
50.0%	50.0% #E48356	RGB 228 131 86	#E48356
66.7%	66.7% #ED915A	RGB 237 145 90	#ED915A
83.3%	83.3% #F69F5E	RGB 246 159 94	#F69F5E
100.0%	100.0% #FFAE63	RGB 255 174 99	#FFAE63

#CA5E4A #D2694E #DB7652 #E48356 #ED915A #F69F5E #FFAE63

#CA5E4A - #E48356 - #FFAE63

CSS codes

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

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