#FFAF45 - #ECE56E | 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 #FFAF45 to #ECE56E

#FFAF45 #ECE56E

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

#FFAF45 - #ECE56E | 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 #FFAF45 as 0% and #ECE56E as 100%.

0.0%	0.0% #FFAF45	RGB 255 175 69	#FFAF45
16.7%	16.7% #FBB84B	RGB 251 184 75	#FBB84B
33.3%	33.3% #F8C152	RGB 248 193 82	#F8C152
50.0%	50.0% #F5CA59	RGB 245 202 89	#F5CA59
66.7%	66.7% #F2D360	RGB 242 211 96	#F2D360
83.3%	83.3% #EFDC67	RGB 239 220 103	#EFDC67
100.0%	100.0% #ECE56E	RGB 236 229 110	#ECE56E

#FFAF45 #FBB84B #F8C152 #F5CA59 #F2D360 #EFDC67 #ECE56E

#FFAF45 - #ECE56E

HSV Blend

#FFAF45 - #ECE56E | 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 #FFAF45 as 0% and #ECE56E as 100%.

0.0%	0.0% #FFAF45	RGB 255 175 69	#FFAF45
16.7%	16.7% #FBBB4C	RGB 251 187 76	#FBBB4C
33.3%	33.3% #F8C653	RGB 248 198 83	#F8C653
50.0%	50.0% #F5CF5A	RGB 245 207 90	#F5CF5A
66.7%	66.7% #F2D861	RGB 242 216 97	#F2D861
83.3%	83.3% #EFDF67	RGB 239 223 103	#EFDF67
100.0%	100.0% #ECE56E	RGB 236 229 110	#ECE56E

#FFAF45 #FBBB4C #F8C653 #F5CF5A #F2D861 #EFDF67 #ECE56E

#FFAF45 - #F5CF5A - #ECE56E

CSS codes

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

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