#FF57F3 - #BC00C0 | 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 #FF57F3 to #BC00C0

#FF57F3 #BC00C0

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

#FF57F3 - #BC00C0 | 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 #FF57F3 as 0% and #BC00C0 as 100%.

0.0%	0.0% #FF57F3	RGB 255 87 243	#FF57F3
16.7%	16.7% #F348EA	RGB 243 72 234	#F348EA
33.3%	33.3% #E83AE2	RGB 232 58 226	#E83AE2
50.0%	50.0% #DD2BD9	RGB 221 43 217	#DD2BD9
66.7%	66.7% #D21CD1	RGB 210 28 209	#D21CD1
83.3%	83.3% #C70EC8	RGB 199 14 200	#C70EC8
100.0%	100.0% #BC00C0	RGB 188 0 192	#BC00C0

#FF57F3 #F348EA #E83AE2 #DD2BD9 #D21CD1 #C70EC8 #BC00C0

#FF57F3 - #BC00C0

HSV Blend

#FF57F3 - #BC00C0 | 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 #FF57F3 as 0% and #BC00C0 as 100%.

0.0%	0.0% #FF57F3	RGB 255 87 243	#FF57F3
16.7%	16.7% #F445EA	RGB 244 69 234	#F445EA
33.3%	33.3% #EA35E2	RGB 234 53 226	#EA35E2
50.0%	50.0% #DF26DA	RGB 223 38 218	#DF26DA
66.7%	66.7% #D518D3	RGB 213 24 211	#D518D3
83.3%	83.3% #C90BCA	RGB 201 11 202	#C90BCA
100.0%	100.0% #BC00C0	RGB 188 0 192	#BC00C0

#FF57F3 #F445EA #EA35E2 #DF26DA #D518D3 #C90BCA #BC00C0

#FF57F3 - #DF26DA - #BC00C0

CSS codes

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

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