#FFF3A8 - #ECCD4F | 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 #FFF3A8 to #ECCD4F

#FFF3A8 #ECCD4F

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

#FFF3A8 - #ECCD4F | 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 #FFF3A8 as 0% and #ECCD4F as 100%.

0.0%	0.0% #FFF3A8	RGB 255 243 168	#FFF3A8
16.7%	16.7% #FBEC99	RGB 251 236 153	#FBEC99
33.3%	33.3% #F8E68A	RGB 248 230 138	#F8E68A
50.0%	50.0% #F5E07B	RGB 245 224 123	#F5E07B
66.7%	66.7% #F2D96C	RGB 242 217 108	#F2D96C
83.3%	83.3% #EFD35D	RGB 239 211 93	#EFD35D
100.0%	100.0% #ECCD4F	RGB 236 205 79	#ECCD4F

#FFF3A8 #FBEC99 #F8E68A #F5E07B #F2D96C #EFD35D #ECCD4F

#FFF3A8 - #ECCD4F

HSV Blend

#FFF3A8 - #ECCD4F | 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 #FFF3A8 as 0% and #ECCD4F as 100%.

0.0%	0.0% #FFF3A8	RGB 255 243 168	#FFF3A8
16.7%	16.7% #FBED98	RGB 251 237 152	#FBED98
33.3%	33.3% #F8E788	RGB 248 231 136	#F8E788
50.0%	50.0% #F5E079	RGB 245 224 121	#F5E079
66.7%	66.7% #F2DA6B	RGB 242 218 107	#F2DA6B
83.3%	83.3% #EFD35C	RGB 239 211 92	#EFD35C
100.0%	100.0% #ECCD4F	RGB 236 205 79	#ECCD4F

#FFF3A8 #FBED98 #F8E788 #F5E079 #F2DA6B #EFD35C #ECCD4F

#FFF3A8 - #F5E079 - #ECCD4F

CSS codes

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

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