#FF45A1 - #FF5BF2 | 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 #FF45A1 to #FF5BF2

#FF45A1 #FF5BF2

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

#FF45A1 - #FF5BF2 | 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 #FF45A1 as 0% and #FF5BF2 as 100%.

0.0%	0.0% #FF45A1	RGB 255 69 161	#FF45A1
16.7%	16.7% #FF48AE	RGB 255 72 174	#FF48AE
33.3%	33.3% #FF4CBC	RGB 255 76 188	#FF4CBC
50.0%	50.0% #FF50C9	RGB 255 80 201	#FF50C9
66.7%	66.7% #FF53D7	RGB 255 83 215	#FF53D7
83.3%	83.3% #FF57E4	RGB 255 87 228	#FF57E4
100.0%	100.0% #FF5BF2	RGB 255 91 242	#FF5BF2

#FF45A1 #FF48AE #FF4CBC #FF50C9 #FF53D7 #FF57E4 #FF5BF2

#FF45A1 - #FF5BF2

HSV Blend

#FF45A1 - #FF5BF2 | 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 #FF45A1 as 0% and #FF5BF2 as 100%.

0.0%	0.0% #FF45A1	RGB 255 69 161	#FF45A1
16.7%	16.7% #FF48AF	RGB 255 72 175	#FF48AF
33.3%	33.3% #FF4CBE	RGB 255 76 190	#FF4CBE
50.0%	50.0% #FF50CB	RGB 255 80 203	#FF50CB
66.7%	66.7% #FF53D9	RGB 255 83 217	#FF53D9
83.3%	83.3% #FF57E5	RGB 255 87 229	#FF57E5
100.0%	100.0% #FF5BF2	RGB 255 91 242	#FF5BF2

#FF45A1 #FF48AF #FF4CBE #FF50CB #FF53D9 #FF57E5 #FF5BF2

#FF45A1 - #FF50CB - #FF5BF2

CSS codes

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

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