#EE82EE
Purple family

Violet

Also known as: luminous · delicate · mystical · elegant · calming
Save
Hex #EE82EE
RGB rgb(238, 130, 238)
HSL hsl(300°, 76%, 72%)
CMYK 0 · 45 · 0 · 7
CSS violet

Meaning

In Western cultures, violet often symbolizes spirituality, creativity, and luxury, while in some Eastern traditions, it can represent mourning or loss. The duality of violet reflects both the mystical and the practical, balancing the warmth of red with the coolness of blue.

The term 'violet' comes from the Latin word 'viola', which refers not only to the flower but also to the color itself. In the 19th century, the violet dye became popular for textiles, with Queen Victoria famously favoring it, solidifying its association with elegance and refinement.

luminousdelicatemysticalelegantcalming

Similar colors

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

All 31 Purples →

Shades & tints

Nine steps of Violet by lightness — from #7C447C (darkest) to #F6BEF6 (lightest). Click any to copy.

-40% #7C447C
-30% #985398
-20% #B563B5
-10% #D172D1
BASE #EE82EE
+15% #F091F0
+30% #F2A0F2
+50% #F4AFF4
+70% #F6BEF6

Complementary

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

Palettes

Curated 5-color combinations featuring Violet.

#EE82EE
#FFD700
#F5F5F5
#8A2BE2
#FF69B4

Spring Awakening

Fresh Bloom
#EE82EE
#4B0082
#2C2C2C
#DDA0DD
#B0E0E6

Royal Night

Elegant Evening
#EE82EE
#FFB6C1
#FFFFFF
#9370DB
#F08080

Whimsical Dreams

Playful Serenity

Violet scale

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

50 #FEF5FE
100 #FCE9FC
200 #F9D0F9
300 #F5B7F5
400 #F29CF2
500 #EE82EE
600 #C36BC3
700 #9D569D
800 #774177
900 #512C51

Accessibility

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

Aa Best text color: #000000 · 9.06:1
Violet as text on… Ratio AA AAA
Aa White background 2.32:1 Fail Fail
Aa Black background 9.06:1 Pass Pass

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 #EE82EE

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

CSS color: violet;
CSS color-mix (lighten 30%) color-mix(in srgb, violet 70%, white)
HSV / HSB 300°, 45%, 93%
CMYK (print) 0, 45, 0, 7
Decimal 15631086
Nearest web-safe #FF99FF

Color vision

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

Normal vision

#EE82EE

Protanopia (no red)

#BFBED4

Deuteranopia (no green)

#C6CECE

Tritanopia (no blue)

#E9BFBB
Purple
2 / 31 Purples Lavender
Copied!