#FF00A8 - #FF45F6 | 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 #FF00A8 to #FF45F6

#FF00A8 #FF45F6

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

#FF00A8 - #FF45F6 | 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 #FF00A8 as 0% and #FF45F6 as 100%.

0.0%	0.0% #FF00A8	RGB 255 0 168	#FF00A8
16.7%	16.7% #FF0BB5	RGB 255 11 181	#FF0BB5
33.3%	33.3% #FF17C2	RGB 255 23 194	#FF17C2
50.0%	50.0% #FF22CF	RGB 255 34 207	#FF22CF
66.7%	66.7% #FF2EDC	RGB 255 46 220	#FF2EDC
83.3%	83.3% #FF39E9	RGB 255 57 233	#FF39E9
100.0%	100.0% #FF45F6	RGB 255 69 246	#FF45F6

#FF00A8 #FF0BB5 #FF17C2 #FF22CF #FF2EDC #FF39E9 #FF45F6

#FF00A8 - #FF45F6

HSV Blend

#FF00A8 - #FF45F6 | 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 #FF00A8 as 0% and #FF45F6 as 100%.

0.0%	0.0% #FF00A7	RGB 255 0 167	#FF00A7
16.7%	16.7% #FF0BB7	RGB 255 11 183	#FF0BB7
33.3%	33.3% #FF16C6	RGB 255 22 198	#FF16C6
50.0%	50.0% #FF22D4	RGB 255 34 212	#FF22D4
66.7%	66.7% #FF2EE0	RGB 255 46 224	#FF2EE0
83.3%	83.3% #FF39EB	RGB 255 57 235	#FF39EB
100.0%	100.0% #FF45F6	RGB 255 69 246	#FF45F6

#FF00A7 #FF0BB7 #FF16C6 #FF22D4 #FF2EE0 #FF39EB #FF45F6

#FF00A8 - #FF22D4 - #FF45F6

CSS codes

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

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