#ECC97D - #D18E2D | 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 #ECC97D to #D18E2D

#ECC97D #D18E2D

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

#ECC97D - #D18E2D | 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 #ECC97D as 0% and #D18E2D as 100%.

0.0%	0.0% #ECC97D	RGB 236 201 125	#ECC97D
16.7%	16.7% #E7BF6F	RGB 231 191 111	#E7BF6F
33.3%	33.3% #E3B562	RGB 227 181 98	#E3B562
50.0%	50.0% #DEAB55	RGB 222 171 85	#DEAB55
66.7%	66.7% #DAA147	RGB 218 161 71	#DAA147
83.3%	83.3% #D5973A	RGB 213 151 58	#D5973A
100.0%	100.0% #D18E2D	RGB 209 142 45	#D18E2D

#ECC97D #E7BF6F #E3B562 #DEAB55 #DAA147 #D5973A #D18E2D

#ECC97D - #D18E2D

HSV Blend

#ECC97D - #D18E2D | 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 #ECC97D as 0% and #D18E2D as 100%.

0.0%	0.0% #ECC97D	RGB 236 201 125	#ECC97D
16.7%	16.7% #E7BF6E	RGB 231 191 110	#E7BF6E
33.3%	33.3% #E3B560	RGB 227 181 96	#E3B560
50.0%	50.0% #DEAB52	RGB 222 171 82	#DEAB52
66.7%	66.7% #DAA245	RGB 218 162 69	#DAA245
83.3%	83.3% #D59839	RGB 213 152 57	#D59839
100.0%	100.0% #D18E2D	RGB 209 142 45	#D18E2D

#ECC97D #E7BF6E #E3B560 #DEAB52 #DAA245 #D59839 #D18E2D

#ECC97D - #DEAB52 - #D18E2D

CSS codes

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

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