#FFF2B5 - #ECCB5C | 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 #FFF2B5 to #ECCB5C

#FFF2B5 #ECCB5C

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

#FFF2B5 - #ECCB5C | 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 #FFF2B5 as 0% and #ECCB5C as 100%.

0.0%	0.0% #FFF2B5	RGB 255 242 181	#FFF2B5
16.7%	16.7% #FBEBA6	RGB 251 235 166	#FBEBA6
33.3%	33.3% #F8E597	RGB 248 229 151	#F8E597
50.0%	50.0% #F5DE88	RGB 245 222 136	#F5DE88
66.7%	66.7% #F2D879	RGB 242 216 121	#F2D879
83.3%	83.3% #EFD16A	RGB 239 209 106	#EFD16A
100.0%	100.0% #ECCB5C	RGB 236 203 92	#ECCB5C

#FFF2B5 #FBEBA6 #F8E597 #F5DE88 #F2D879 #EFD16A #ECCB5C

#FFF2B5 - #ECCB5C

HSV Blend

#FFF2B5 - #ECCB5C | 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 #FFF2B5 as 0% and #ECCB5C as 100%.

0.0%	0.0% #FFF2B5	RGB 255 242 181	#FFF2B5
16.7%	16.7% #FBEBA5	RGB 251 235 165	#FBEBA5
33.3%	33.3% #F8E595	RGB 248 229 149	#F8E595
50.0%	50.0% #F5DF86	RGB 245 223 134	#F5DF86
66.7%	66.7% #F2D878	RGB 242 216 120	#F2D878
83.3%	83.3% #EFD169	RGB 239 209 105	#EFD169
100.0%	100.0% #ECCB5C	RGB 236 203 92	#ECCB5C

#FFF2B5 #FBEBA5 #F8E595 #F5DF86 #F2D878 #EFD169 #ECCB5C

#FFF2B5 - #F5DF86 - #ECCB5C

CSS codes

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

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