#CCC981 - #FFE99E | 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 #CCC981 to #FFE99E

#CCC981 #FFE99E

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

#CCC981 - #FFE99E | 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 #CCC981 as 0% and #FFE99E as 100%.

0.0%	0.0% #CCC981	RGB 204 201 129	#CCC981
16.7%	16.7% #D4CE85	RGB 212 206 133	#D4CE85
33.3%	33.3% #DDD38A	RGB 221 211 138	#DDD38A
50.0%	50.0% #E5D98F	RGB 229 217 143	#E5D98F
66.7%	66.7% #EEDE94	RGB 238 222 148	#EEDE94
83.3%	83.3% #F6E399	RGB 246 227 153	#F6E399
100.0%	100.0% #FFE99E	RGB 255 233 158	#FFE99E

#CCC981 #D4CE85 #DDD38A #E5D98F #EEDE94 #F6E399 #FFE99E

#CCC981 - #FFE99E

HSV Blend

#CCC981 - #FFE99E | 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 #CCC981 as 0% and #FFE99E as 100%.

0.0%	0.0% #CCC981	RGB 204 201 129	#CCC981
16.7%	16.7% #D4CE85	RGB 212 206 133	#D4CE85
33.3%	33.3% #DDD48A	RGB 221 212 138	#DDD48A
50.0%	50.0% #E5DA8F	RGB 229 218 143	#E5DA8F
66.7%	66.7% #EEDF94	RGB 238 223 148	#EEDF94
83.3%	83.3% #F6E499	RGB 246 228 153	#F6E499
100.0%	100.0% #FFE99E	RGB 255 233 158	#FFE99E

#CCC981 #D4CE85 #DDD48A #E5DA8F #EEDF94 #F6E499 #FFE99E

#CCC981 - #E5DA8F - #FFE99E

CSS codes

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

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