#F7D4A2 - #CD8F31 | 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 #F7D4A2 to #CD8F31

#F7D4A2 #CD8F31

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

#F7D4A2 - #CD8F31 | 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 #F7D4A2 as 0% and #CD8F31 as 100%.

0.0%	0.0% #F7D4A2	RGB 247 212 162	#F7D4A2
16.7%	16.7% #F0C88F	RGB 240 200 143	#F0C88F
33.3%	33.3% #E9BD7C	RGB 233 189 124	#E9BD7C
50.0%	50.0% #E2B169	RGB 226 177 105	#E2B169
66.7%	66.7% #DBA656	RGB 219 166 86	#DBA656
83.3%	83.3% #D49A43	RGB 212 154 67	#D49A43
100.0%	100.0% #CD8F31	RGB 205 143 49	#CD8F31

#F7D4A2 #F0C88F #E9BD7C #E2B169 #DBA656 #D49A43 #CD8F31

#F7D4A2 - #CD8F31

HSV Blend

#F7D4A2 - #CD8F31 | 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 #F7D4A2 as 0% and #CD8F31 as 100%.

0.0%	0.0% #F7D4A2	RGB 247 212 162	#F7D4A2
16.7%	16.7% #F0C78C	RGB 240 199 140	#F0C78C
33.3%	33.3% #E9BB78	RGB 233 187 120	#E9BB78
50.0%	50.0% #E2AF65	RGB 226 175 101	#E2AF65
66.7%	66.7% #DBA452	RGB 219 164 82	#DBA452
83.3%	83.3% #D49941	RGB 212 153 65	#D49941
100.0%	100.0% #CD8F31	RGB 205 143 49	#CD8F31

#F7D4A2 #F0C78C #E9BB78 #E2AF65 #DBA452 #D49941 #CD8F31

#F7D4A2 - #E2AF65 - #CD8F31

CSS codes

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

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