#F03C86 - #B80D5E | 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 #F03C86 to #B80D5E

#F03C86 #B80D5E

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

#F03C86 - #B80D5E | 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 #F03C86 as 0% and #B80D5E as 100%.

0.0%	0.0% #F03C86	RGB 240 60 134	#F03C86
16.7%	16.7% #E6347F	RGB 230 52 127	#E6347F
33.3%	33.3% #DD2C78	RGB 221 44 120	#DD2C78
50.0%	50.0% #D42472	RGB 212 36 114	#D42472
66.7%	66.7% #CA1C6B	RGB 202 28 107	#CA1C6B
83.3%	83.3% #C11464	RGB 193 20 100	#C11464
100.0%	100.0% #B80D5E	RGB 184 13 94	#B80D5E

#F03C86 #E6347F #DD2C78 #D42472 #CA1C6B #C11464 #B80D5E

#F03C86 - #B80D5E

HSV Blend

#F03C86 - #B80D5E | 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 #F03C86 as 0% and #B80D5E as 100%.

0.0%	0.0% #F03C86	RGB 240 60 134	#F03C86
16.7%	16.7% #E6327E	RGB 230 50 126	#E6327E
33.3%	33.3% #DD2A77	RGB 221 42 119	#DD2A77
50.0%	50.0% #D42170	RGB 212 33 112	#D42170
66.7%	66.7% #CA1A6A	RGB 202 26 106	#CA1A6A
83.3%	83.3% #C11363	RGB 193 19 99	#C11363
100.0%	100.0% #B80D5E	RGB 184 13 94	#B80D5E

#F03C86 #E6327E #DD2A77 #D42170 #CA1A6A #C11363 #B80D5E

#F03C86 - #D42170 - #B80D5E

CSS codes

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

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