#ECEC3A - #FFF377 | 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 #ECEC3A to #FFF377

#ECEC3A #FFF377

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

#ECEC3A - #FFF377 | 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 #ECEC3A as 0% and #FFF377 as 100%.

0.0%	0.0% #ECEC3A	RGB 236 236 58	#ECEC3A
16.7%	16.7% #EFED44	RGB 239 237 68	#EFED44
33.3%	33.3% #F2EE4E	RGB 242 238 78	#F2EE4E
50.0%	50.0% #F5EF58	RGB 245 239 88	#F5EF58
66.7%	66.7% #F8F062	RGB 248 240 98	#F8F062
83.3%	83.3% #FBF16C	RGB 251 241 108	#FBF16C
100.0%	100.0% #FFF377	RGB 255 243 119	#FFF377

#ECEC3A #EFED44 #F2EE4E #F5EF58 #F8F062 #FBF16C #FFF377

#ECEC3A - #FFF377

HSV Blend

#ECEC3A - #FFF377 | 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 #ECEC3A as 0% and #FFF377 as 100%.

0.0%	0.0% #ECEC3A	RGB 236 236 58	#ECEC3A
16.7%	16.7% #EFEC43	RGB 239 236 67	#EFEC43
33.3%	33.3% #F2ED4D	RGB 242 237 77	#F2ED4D
50.0%	50.0% #F5EE57	RGB 245 238 87	#F5EE57
66.7%	66.7% #F8EF61	RGB 248 239 97	#F8EF61
83.3%	83.3% #FBF16C	RGB 251 241 108	#FBF16C
100.0%	100.0% #FFF377	RGB 255 243 119	#FFF377

#ECEC3A #EFEC43 #F2ED4D #F5EE57 #F8EF61 #FBF16C #FFF377

#ECEC3A - #F5EE57 - #FFF377

CSS codes

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

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