#FFAF46 - #ECE56F | 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 #FFAF46 to #ECE56F

#FFAF46 #ECE56F

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

#FFAF46 - #ECE56F | 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 #FFAF46 as 0% and #ECE56F as 100%.

0.0%	0.0% #FFAF46	RGB 255 175 70	#FFAF46
16.7%	16.7% #FBB84C	RGB 251 184 76	#FBB84C
33.3%	33.3% #F8C153	RGB 248 193 83	#F8C153
50.0%	50.0% #F5CA5A	RGB 245 202 90	#F5CA5A
66.7%	66.7% #F2D361	RGB 242 211 97	#F2D361
83.3%	83.3% #EFDC68	RGB 239 220 104	#EFDC68
100.0%	100.0% #ECE56F	RGB 236 229 111	#ECE56F

#FFAF46 #FBB84C #F8C153 #F5CA5A #F2D361 #EFDC68 #ECE56F

#FFAF46 - #ECE56F

HSV Blend

#FFAF46 - #ECE56F | 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 #FFAF46 as 0% and #ECE56F as 100%.

0.0%	0.0% #FFAF45	RGB 255 175 69	#FFAF45
16.7%	16.7% #FBBB4D	RGB 251 187 77	#FBBB4D
33.3%	33.3% #F8C654	RGB 248 198 84	#F8C654
50.0%	50.0% #F5CF5B	RGB 245 207 91	#F5CF5B
66.7%	66.7% #F2D862	RGB 242 216 98	#F2D862
83.3%	83.3% #EFDF68	RGB 239 223 104	#EFDF68
100.0%	100.0% #ECE56F	RGB 236 229 111	#ECE56F

#FFAF45 #FBBB4D #F8C654 #F5CF5B #F2D862 #EFDF68 #ECE56F

#FFAF46 - #F5CF5B - #ECE56F

CSS codes

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

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