#CF9757 - #FFD577 | 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 #CF9757 to #FFD577

#CF9757 #FFD577

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

#CF9757 - #FFD577 | 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 #CF9757 as 0% and #FFD577 as 100%.

0.0%	0.0% #CF9757	RGB 207 151 87	#CF9757
16.7%	16.7% #D7A15C	RGB 215 161 92	#D7A15C
33.3%	33.3% #DFAB61	RGB 223 171 97	#DFAB61
50.0%	50.0% #E7B667	RGB 231 182 103	#E7B667
66.7%	66.7% #EFC06C	RGB 239 192 108	#EFC06C
83.3%	83.3% #F7CA71	RGB 247 202 113	#F7CA71
100.0%	100.0% #FFD577	RGB 255 213 119	#FFD577

#CF9757 #D7A15C #DFAB61 #E7B667 #EFC06C #F7CA71 #FFD577

#CF9757 - #FFD577

HSV Blend

#CF9757 - #FFD577 | 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 #CF9757 as 0% and #FFD577 as 100%.

0.0%	0.0% #CF9757	RGB 207 151 87	#CF9757
16.7%	16.7% #D7A05C	RGB 215 160 92	#D7A05C
33.3%	33.3% #DFAA61	RGB 223 170 97	#DFAA61
50.0%	50.0% #E7B566	RGB 231 181 102	#E7B566
66.7%	66.7% #EFBF6B	RGB 239 191 107	#EFBF6B
83.3%	83.3% #F7CA71	RGB 247 202 113	#F7CA71
100.0%	100.0% #FFD577	RGB 255 213 119	#FFD577

#CF9757 #D7A05C #DFAA61 #E7B566 #EFBF6B #F7CA71 #FFD577

#CF9757 - #E7B566 - #FFD577

CSS codes

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

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