#FF00FF
Pink family

Magenta

Also known as: vibrant · dynamic · bold · playful · electric
Save
Hex #FF00FF
RGB rgb(255, 0, 255)
HSL hsl(300°, 100%, 50%)
CMYK 0 · 100 · 0 · 0
CSS fuchsia

Meaning

In Western cultures, magenta can symbolize creativity and innovation, while in some Eastern traditions, it represents harmony and balance. The color evokes a sense of playfulness, contrasting with more traditional colors often associated with seriousness.

The name 'magenta' originated from the Battle of Magenta in 1859, where the dye was first synthesized shortly after. This synthetic dye, known as fuchsine, became a staple for textile production, revolutionizing the color palette available to fashion and art.

vibrantdynamicboldplayfulelectric

Similar colors

Ranked by CIE76 ΔE — the perceptual distance from Magenta. Lower ΔE means a closer match (below ~2 is barely distinguishable).

All 25 Pinks →

Shades & tints

Nine steps of Magenta by lightness — from #850085 (darkest) to #FF7AFF (lightest). Click any to copy.

-40% #850085
-30% #A300A3
-20% #C200C2
-10% #E000E0
BASE #FF00FF
+15% #FF1FFF
+30% #FF3DFF
+50% #FF5CFF
+70% #FF7AFF

Complementary

Sitting opposite Magenta at 120° on the color wheel, these give the highest-contrast pairings.

Palettes

Curated 5-color combinations featuring Magenta.

#FF00FF
#00FFFF
#FFFFFF
#FF4500
#8A2BE2

Electric Energy

Vibrant excitement
#FF00FF
#FFC0CB
#F5F5F5
#FFD700
#ADFF2F

Floral Fantasy

Whimsical charm
#FF00FF
#FFD700
#2E2E2E
#FF6347
#00FF7F

Retro Pop

Nostalgic fun

Used by

Brands and institutions known for using Magenta.

T-Mobile

Magenta scale

A 50–900 tonal scale with Magenta anchored at 500 — ready to drop into a design system. Click any step to copy.

50 #FFEBFF
100 #FFD1FF
200 #FF9EFF
300 #FF6BFF
400 #FF36FF
500 #FF00FF
600 #D100D1
700 #A800A8
800 #800080
900 #570057

Accessibility

Works well as text on dark backgrounds; fails on light.

Aa Best text color: #000000 · 6.7:1
Magenta as text on… Ratio AA AAA
Aa White background 3.14:1 Large only Fail
Aa Black background 6.7:1 Pass Large only

Thresholds: AA needs 4.5:1 (normal text) / 3:1 (large); AAA needs 7:1 / 4.5:1. Large = 18pt+ or 14pt+ bold.

How to use #FF00FF

Copy-ready values for CSS, screen and print, plus the extra conversions designers reach for.

CSS color: fuchsia;
CSS color-mix (lighten 30%) color-mix(in srgb, fuchsia 70%, white)
HSV / HSB 300°, 100%, 100%
CMYK (print) 0, 100, 0, 0
Decimal 16711935
Nearest web-safe #FF00FF

Color vision

How Magenta appears to viewers with the three main types of color blindness (~1 in 12 men, 1 in 200 women). Simulated approximations.

Normal vision

#FF00FF

Protanopia (no red)

#918EC1

Deuteranopia (no green)

#9FB3B3

Tritanopia (no blue)

#F29186
Hot Pink
3 / 25 Pinks Fuchsia
Copied!