#FFBCA6 - #EC6C4D | 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 #FFBCA6 to #EC6C4D

#FFBCA6 #EC6C4D

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

#FFBCA6 - #EC6C4D | 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 #FFBCA6 as 0% and #EC6C4D as 100%.

0.0%	0.0% #FFBCA6	RGB 255 188 166	#FFBCA6
16.7%	16.7% #FBAE97	RGB 251 174 151	#FBAE97
33.3%	33.3% #F8A188	RGB 248 161 136	#F8A188
50.0%	50.0% #F59479	RGB 245 148 121	#F59479
66.7%	66.7% #F2866A	RGB 242 134 106	#F2866A
83.3%	83.3% #EF795B	RGB 239 121 91	#EF795B
100.0%	100.0% #EC6C4D	RGB 236 108 77	#EC6C4D

#FFBCA6 #FBAE97 #F8A188 #F59479 #F2866A #EF795B #EC6C4D

#FFBCA6 - #EC6C4D

HSV Blend

#FFBCA6 - #EC6C4D | 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 #FFBCA6 as 0% and #EC6C4D as 100%.

0.0%	0.0% #FFBCA6	RGB 255 188 166	#FFBCA6
16.7%	16.7% #FBAE96	RGB 251 174 150	#FBAE96
33.3%	33.3% #F8A186	RGB 248 161 134	#F8A186
50.0%	50.0% #F59377	RGB 245 147 119	#F59377
66.7%	66.7% #F28669	RGB 242 134 105	#F28669
83.3%	83.3% #EF795A	RGB 239 121 90	#EF795A
100.0%	100.0% #EC6C4D	RGB 236 108 77	#EC6C4D

#FFBCA6 #FBAE96 #F8A186 #F59377 #F28669 #EF795A #EC6C4D

#FFBCA6 - #F59377 - #EC6C4D

CSS codes

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

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