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

#FFF4A6 #ECCF4D

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

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

0.0%	0.0% #FFF4A6	RGB 255 244 166	#FFF4A6
16.7%	16.7% #FBED97	RGB 251 237 151	#FBED97
33.3%	33.3% #F8E788	RGB 248 231 136	#F8E788
50.0%	50.0% #F5E179	RGB 245 225 121	#F5E179
66.7%	66.7% #F2DB6A	RGB 242 219 106	#F2DB6A
83.3%	83.3% #EFD55B	RGB 239 213 91	#EFD55B
100.0%	100.0% #ECCF4D	RGB 236 207 77	#ECCF4D

#FFF4A6 #FBED97 #F8E788 #F5E179 #F2DB6A #EFD55B #ECCF4D

#FFF4A6 - #ECCF4D

HSV Blend

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

0.0%	0.0% #FFF4A6	RGB 255 244 166	#FFF4A6
16.7%	16.7% #FBEE96	RGB 251 238 150	#FBEE96
33.3%	33.3% #F8E886	RGB 248 232 134	#F8E886
50.0%	50.0% #F5E277	RGB 245 226 119	#F5E277
66.7%	66.7% #F2DC69	RGB 242 220 105	#F2DC69
83.3%	83.3% #EFD55A	RGB 239 213 90	#EFD55A
100.0%	100.0% #ECCF4D	RGB 236 207 77	#ECCF4D

#FFF4A6 #FBEE96 #F8E886 #F5E277 #F2DC69 #EFD55A #ECCF4D

#FFF4A6 - #F5E277 - #ECCF4D

CSS codes

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

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