#FF9F36 - #ECDD5A | 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 #FF9F36 to #ECDD5A

#FF9F36 #ECDD5A

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

#FF9F36 - #ECDD5A | 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 #FF9F36 as 0% and #ECDD5A as 100%.

0.0%	0.0% #FF9F36	RGB 255 159 54	#FF9F36
16.7%	16.7% #FBA93C	RGB 251 169 60	#FBA93C
33.3%	33.3% #F8B342	RGB 248 179 66	#F8B342
50.0%	50.0% #F5BE48	RGB 245 190 72	#F5BE48
66.7%	66.7% #F2C84E	RGB 242 200 78	#F2C84E
83.3%	83.3% #EFD254	RGB 239 210 84	#EFD254
100.0%	100.0% #ECDD5A	RGB 236 221 90	#ECDD5A

#FF9F36 #FBA93C #F8B342 #F5BE48 #F2C84E #EFD254 #ECDD5A

#FF9F36 - #ECDD5A

HSV Blend

#FF9F36 - #ECDD5A | 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 #FF9F36 as 0% and #ECDD5A as 100%.

0.0%	0.0% #FF9E35	RGB 255 158 53	#FF9E35
16.7%	16.7% #FBAC3C	RGB 251 172 60	#FBAC3C
33.3%	33.3% #F8B842	RGB 248 184 66	#F8B842
50.0%	50.0% #F5C348	RGB 245 195 72	#F5C348
66.7%	66.7% #F2CD4E	RGB 242 205 78	#F2CD4E
83.3%	83.3% #EFD554	RGB 239 213 84	#EFD554
100.0%	100.0% #ECDD5A	RGB 236 221 90	#ECDD5A

#FF9E35 #FBAC3C #F8B842 #F5C348 #F2CD4E #EFD554 #ECDD5A

#FF9F36 - #F5C348 - #ECDD5A

CSS codes

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

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