#FF5BA1 - #BA0057 | 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 #FF5BA1 to #BA0057

#FF5BA1 #BA0057

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

#FF5BA1 - #BA0057 | 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 #FF5BA1 as 0% and #BA0057 as 100%.

0.0%	0.0% #FF5BA1	RGB 255 91 161	#FF5BA1
16.7%	16.7% #F34B94	RGB 243 75 148	#F34B94
33.3%	33.3% #E83C88	RGB 232 60 136	#E83C88
50.0%	50.0% #DC2D7C	RGB 220 45 124	#DC2D7C
66.7%	66.7% #D11E6F	RGB 209 30 111	#D11E6F
83.3%	83.3% #C50F63	RGB 197 15 99	#C50F63
100.0%	100.0% #BA0057	RGB 186 0 87	#BA0057

#FF5BA1 #F34B94 #E83C88 #DC2D7C #D11E6F #C50F63 #BA0057

#FF5BA1 - #BA0057

HSV Blend

#FF5BA1 - #BA0057 | 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 #FF5BA1 as 0% and #BA0057 as 100%.

0.0%	0.0% #FF5BA0	RGB 255 91 160	#FF5BA0
16.7%	16.7% #F34892	RGB 243 72 146	#F34892
33.3%	33.3% #E83785	RGB 232 55 133	#E83785
50.0%	50.0% #DC2778	RGB 220 39 120	#DC2778
66.7%	66.7% #D1186C	RGB 209 24 108	#D1186C
83.3%	83.3% #C50B61	RGB 197 11 97	#C50B61
100.0%	100.0% #BA0057	RGB 186 0 87	#BA0057

#FF5BA0 #F34892 #E83785 #DC2778 #D1186C #C50B61 #BA0057

#FF5BA1 - #DC2778 - #BA0057

CSS codes

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

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