#E3C257 - #FFE980 | 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 #E3C257 to #FFE980

#E3C257 #FFE980

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

#E3C257 - #FFE980 | 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 #E3C257 as 0% and #FFE980 as 100%.

0.0%	0.0% #E3C257	RGB 227 194 87	#E3C257
16.7%	16.7% #E7C85D	RGB 231 200 93	#E7C85D
33.3%	33.3% #ECCF64	RGB 236 207 100	#ECCF64
50.0%	50.0% #F1D56B	RGB 241 213 107	#F1D56B
66.7%	66.7% #F5DC72	RGB 245 220 114	#F5DC72
83.3%	83.3% #FAE279	RGB 250 226 121	#FAE279
100.0%	100.0% #FFE980	RGB 255 233 128	#FFE980

#E3C257 #E7C85D #ECCF64 #F1D56B #F5DC72 #FAE279 #FFE980

#E3C257 - #FFE980

HSV Blend

#E3C257 - #FFE980 | 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 #E3C257 as 0% and #FFE980 as 100%.

0.0%	0.0% #E3C257	RGB 227 194 87	#E3C257
16.7%	16.7% #E7C85D	RGB 231 200 93	#E7C85D
33.3%	33.3% #ECCF63	RGB 236 207 99	#ECCF63
50.0%	50.0% #F1D56A	RGB 241 213 106	#F1D56A
66.7%	66.7% #F5DC71	RGB 245 220 113	#F5DC71
83.3%	83.3% #FAE278	RGB 250 226 120	#FAE278
100.0%	100.0% #FFE980	RGB 255 233 128	#FFE980

#E3C257 #E7C85D #ECCF63 #F1D56A #F5DC71 #FAE278 #FFE980

#E3C257 - #F1D56A - #FFE980

CSS codes

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

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