Saturated Vibrant Fuchsia
Category: Pink
Magenta (#FF00FF) — Color Codes, Meaning & UI Palettes
Magenta is an extra-spectral color synthesized by our visual perception when red and blue wavelengths blend. It represents non-conformity, audacity, and electric creative energy.
Click to Copy HEX
Magenta
#FF00FF
HEX
#FF00FF
RGB
rgb(255, 0, 255)
HSL
hsl(300deg, 100%, 50%)
CMYK (Print)
cmyk(0%, 100%, 0%, 0%)
Apple Display P3
color(display-p3 1.000 0.000 1.000)
WCAG 2.1 Accessibility & Contrast Rating
White Text (#FFFFFF)
3.14:1 (AA Large)
Black Text (#000000)
6.7:1 (AA)
11-Step Tints & Shades Scale (Tailwind 50–950)
Mathematically balanced luminance scale for design tokens and CSS color palettes. Click any shade to copy hex code:
50
#FFF0FF
100
#FFD6FF
200
#FFADFF
300
#FF7AFF
400
#FF3DFF
500
#FF00FF
600
#CC00CC
700
#990099
800
#660066
900
#380038
950
#1F001F
Color Harmonies & Palette Schemes
Complementary
#00FF00
Opposite 180° Contrast
Analogous -30°
#7F00FF
Natural Harmony
Analogous +30°
#FF0080
Natural Harmony
Triadic +120°
#FFFF00
120° Balanced Triad
Triadic +240°
#00FFFF
120° Balanced Triad
Curated UI Design Pairings for Magenta
Use sparingly as a high-intensity accent for live notifications, gaming HUDs, and creative agency hero badges.
Carbon Black
#12141A
High-Voltage Background
Electric Cyan
#00FFFF
Cyberpunk Neon Pair
Pure White
#FFFFFF
Sharp Focal Element
Deep Violet
#8A2BE2
Analogous Gradient Step
Export Magenta Code Snippets
CSS Variable
--color-magenta-color: #FF00FF;
Tailwind Config
'magenta-color': '#FF00FF'
Swift / SwiftUI
Color(hex: "#FF00FF")
JSON Design Token
{"name": "Magenta", "hex": "#FF00FF"}
Explore More Colors in the Dictionary
Browse our complete catalog of curated named colors, harmonic palettes, and accessible UI combinations.