#FFDF75 - #ECAC26 | 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 #FFDF75 to #ECAC26

#FFDF75 #ECAC26

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

#FFDF75 - #ECAC26 | 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 #FFDF75 as 0% and #ECAC26 as 100%.

0.0%	0.0% #FFDF75	RGB 255 223 117	#FFDF75
16.7%	16.7% #FBD667	RGB 251 214 103	#FBD667
33.3%	33.3% #F8CE5A	RGB 248 206 90	#F8CE5A
50.0%	50.0% #F5C54D	RGB 245 197 77	#F5C54D
66.7%	66.7% #F2BD40	RGB 242 189 64	#F2BD40
83.3%	83.3% #EFB433	RGB 239 180 51	#EFB433
100.0%	100.0% #ECAC26	RGB 236 172 38	#ECAC26

#FFDF75 #FBD667 #F8CE5A #F5C54D #F2BD40 #EFB433 #ECAC26

#FFDF75 - #ECAC26

HSV Blend

#FFDF75 - #ECAC26 | 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 #FFDF75 as 0% and #ECAC26 as 100%.

0.0%	0.0% #FFDF75	RGB 255 223 117	#FFDF75
16.7%	16.7% #FBD767	RGB 251 215 103	#FBD767
33.3%	33.3% #F8CE59	RGB 248 206 89	#F8CE59
50.0%	50.0% #F5C64C	RGB 245 198 76	#F5C64C
66.7%	66.7% #F2BD3F	RGB 242 189 63	#F2BD3F
83.3%	83.3% #EFB532	RGB 239 181 50	#EFB532
100.0%	100.0% #ECAC26	RGB 236 172 38	#ECAC26

#FFDF75 #FBD767 #F8CE59 #F5C64C #F2BD3F #EFB532 #ECAC26

#FFDF75 - #F5C64C - #ECAC26

CSS codes

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

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