#FFCC4D - #DF8D13 | 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 #FFCC4D to #DF8D13

#FFCC4D #DF8D13

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

#FFCC4D - #DF8D13 | 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 #FFCC4D as 0% and #DF8D13 as 100%.

0.0%	0.0% #FFCC4D	RGB 255 204 77	#FFCC4D
16.7%	16.7% #F9C143	RGB 249 193 67	#F9C143
33.3%	33.3% #F4B739	RGB 244 183 57	#F4B739
50.0%	50.0% #EFAC30	RGB 239 172 48	#EFAC30
66.7%	66.7% #E9A226	RGB 233 162 38	#E9A226
83.3%	83.3% #E4971C	RGB 228 151 28	#E4971C
100.0%	100.0% #DF8D13	RGB 223 141 19	#DF8D13

#FFCC4D #F9C143 #F4B739 #EFAC30 #E9A226 #E4971C #DF8D13

#FFCC4D - #DF8D13

HSV Blend

#FFCC4D - #DF8D13 | 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 #FFCC4D as 0% and #DF8D13 as 100%.

0.0%	0.0% #FFCC4D	RGB 255 204 77	#FFCC4D
16.7%	16.7% #F9C142	RGB 249 193 66	#F9C142
33.3%	33.3% #F4B738	RGB 244 183 56	#F4B738
50.0%	50.0% #EFAC2E	RGB 239 172 46	#EFAC2E
66.7%	66.7% #E9A224	RGB 233 162 36	#E9A224
83.3%	83.3% #E4971B	RGB 228 151 27	#E4971B
100.0%	100.0% #DF8D13	RGB 223 141 19	#DF8D13

#FFCC4D #F9C142 #F4B738 #EFAC2E #E9A224 #E4971B #DF8D13

#FFCC4D - #EFAC2E - #DF8D13

CSS codes

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

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