#FF00D1 - #8D8DFF | 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 #FF00D1 to #8D8DFF

#FF00D1 #8D8DFF

Calculate the color between two colors, #FF00D1 and #8D8DFF. 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)

#FF00D1 - #8D8DFF | 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 #FF00D1 as 0% and #8D8DFF as 100%.

0.0%	0.0% #FF00D1	RGB 255 0 209	#FF00D1
16.7%	16.7% #EC17D8	RGB 236 23 216	#EC17D8
33.3%	33.3% #D92FE0	RGB 217 47 224	#D92FE0
50.0%	50.0% #C646E8	RGB 198 70 232	#C646E8
66.7%	66.7% #B35EEF	RGB 179 94 239	#B35EEF
83.3%	83.3% #A075F7	RGB 160 117 247	#A075F7
100.0%	100.0% #8D8DFF	RGB 141 141 255	#8D8DFF

#FF00D1 #EC17D8 #D92FE0 #C646E8 #B35EEF #A075F7 #8D8DFF

#FF00D1 - #8D8DFF

HSV Blend

#FF00D1 - #8D8DFF | 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 #FF00D1 as 0% and #8D8DFF as 100%.

0.0%	0.0% #FF00D1	RGB 255 0 209	#FF00D1
16.7%	16.7% #FB17FF	RGB 251 23 255	#FB17FF
33.3%	33.3% #D22EFF	RGB 210 46 255	#D22EFF
50.0%	50.0% #B346FF	RGB 179 70 255	#B346FF
66.7%	66.7% #9D5EFF	RGB 157 94 255	#9D5EFF
83.3%	83.3% #9075FF	RGB 144 117 255	#9075FF
100.0%	100.0% #8D8DFF	RGB 141 141 255	#8D8DFF

#FF00D1 #FB17FF #D22EFF #B346FF #9D5EFF #9075FF #8D8DFF

#FF00D1 - #B346FF - #8D8DFF

CSS codes

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

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