#EF663C - #FFCD4B | 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 #EF663C to #FFCD4B

#EF663C #FFCD4B

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

#EF663C - #FFCD4B | 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 #EF663C as 0% and #FFCD4B as 100%.

0.0%	0.0% #EF663C	RGB 239 102 60	#EF663C
16.7%	16.7% #F1773E	RGB 241 119 62	#F1773E
33.3%	33.3% #F48841	RGB 244 136 65	#F48841
50.0%	50.0% #F79943	RGB 247 153 67	#F79943
66.7%	66.7% #F9AA46	RGB 249 170 70	#F9AA46
83.3%	83.3% #FCBB48	RGB 252 187 72	#FCBB48
100.0%	100.0% #FFCD4B	RGB 255 205 75	#FFCD4B

#EF663C #F1773E #F48841 #F79943 #F9AA46 #FCBB48 #FFCD4B

#EF663C - #FFCD4B

HSV Blend

#EF663C - #FFCD4B | 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 #EF663C as 0% and #FFCD4B as 100%.

0.0%	0.0% #EF663C	RGB 239 102 60	#EF663C
16.7%	16.7% #F1773E	RGB 241 119 62	#F1773E
33.3%	33.3% #F48840	RGB 244 136 64	#F48840
50.0%	50.0% #F79943	RGB 247 153 67	#F79943
66.7%	66.7% #F9AA45	RGB 249 170 69	#F9AA45
83.3%	83.3% #FCBB48	RGB 252 187 72	#FCBB48
100.0%	100.0% #FFCD4B	RGB 255 205 75	#FFCD4B

#EF663C #F1773E #F48840 #F79943 #F9AA45 #FCBB48 #FFCD4B

#EF663C - #F79943 - #FFCD4B

CSS codes

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

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