#ECCF4D - #FDED7C | 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 #ECCF4D to #FDED7C

#ECCF4D #FDED7C

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

#ECCF4D - #FDED7C | 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 #ECCF4D as 0% and #FDED7C as 100%.

0.0%	0.0% #ECCF4D	RGB 236 207 77	#ECCF4D
16.7%	16.7% #EED454	RGB 238 212 84	#EED454
33.3%	33.3% #F1D95C	RGB 241 217 92	#F1D95C
50.0%	50.0% #F4DE64	RGB 244 222 100	#F4DE64
66.7%	66.7% #F7E36C	RGB 247 227 108	#F7E36C
83.3%	83.3% #FAE874	RGB 250 232 116	#FAE874
100.0%	100.0% #FDED7C	RGB 253 237 124	#FDED7C

#ECCF4D #EED454 #F1D95C #F4DE64 #F7E36C #FAE874 #FDED7C

#ECCF4D - #FDED7C

HSV Blend

#ECCF4D - #FDED7C | 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 #ECCF4D as 0% and #FDED7C as 100%.

0.0%	0.0% #ECCF4D	RGB 236 207 77	#ECCF4D
16.7%	16.7% #EED454	RGB 238 212 84	#EED454
33.3%	33.3% #F1D95C	RGB 241 217 92	#F1D95C
50.0%	50.0% #F4DE63	RGB 244 222 99	#F4DE63
66.7%	66.7% #F7E36B	RGB 247 227 107	#F7E36B
83.3%	83.3% #FAE873	RGB 250 232 115	#FAE873
100.0%	100.0% #FDED7C	RGB 253 237 124	#FDED7C

#ECCF4D #EED454 #F1D95C #F4DE63 #F7E36B #FAE873 #FDED7C

#ECCF4D - #F4DE63 - #FDED7C

CSS codes

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

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