Shades of purple: color palettes and hex codes

Palettes built around purple. Click any swatch to copy its hex code.

Purple runs from the palest lavender to a near-black eggplant, and the shade decides the message: the light end reads soft and floral, the dark end expensive and serious. CSS defines purple as #800080, though most interfaces use something brighter — the scale below starts from #8E4EC6.

Purple hex, RGB, HSL and OKLCH

#8E4EC6
HEX
#8E4EC6
RGB
rgb(142, 78, 198)
HSL
hsl(272, 51%, 54%)
OKLCH
oklch(55.6% 0.183 305.9)
On white
5.18:1
On black
4.06:1

Shades of purple

Eleven steps from one base color, generated in OKLCH so each step is an equal perceived step rather than an equal numeric one. Click a swatch to copy it.

Named shades and close relatives

Purple, violet and magenta

These get used interchangeably and are not the same thing. Violet is a single wavelength at the end of the visible spectrum and sits nearer blue, around hue 260 to 275. Purple has no single wavelength — it is what the eye reports when red and blue arrive together — and covers roughly 270 to 320. Past 320 the color reads as magenta or fuchsia.

The boundary matters in practice. Anything below hue 255 is tagged blue on this site and anything above 300 pink, so a palette listed here measures as purple rather than merely being called it.

Where purple works

Beauty and fragrance packaging, wellness and meditation apps, wine and spirits labels, fantasy and mystery covers, and technology brands wanting to look creative rather than corporate. Deep purples read as luxury, pale ones as calm.

Yellow and gold are the direct complement and give the strongest contrast. For something calmer, an analogous scheme with blue or magenta stays in the family, and warm neutrals — cream, sand, taupe — soften purple without competing with it. The one place it struggles is food, outside berries and aubergine, where it tends to read as artificial.

Contrast and readability

Purple on white measures 5.18:1 and on black 4.06:1. WCAG AA asks for 4.5:1 on normal text and 3:1 on large text and UI components, so the higher of those two decides which background it belongs on. In the scale above, 500 is the first to clear 4.5:1 on white, at 5.74:1.

The contrast checker reports every level for a given pair and suggests the nearest passing shade on the same hue. The color picker builds this same scale from any color you paste in.

Purple color questions

What are the main shades of purple?
From lightest to darkest: lavender and lilac at the pale end, orchid and amethyst in the middle, then royal purple, byzantium, plum and eggplant. They differ in lightness and hue at once, which is why a single purple swatch never covers the range.
What is the hex code for purple?
CSS defines purple as #800080, a dark magenta-leaning shade that is rarely the one people mean. Most modern interfaces use something closer to #8549BA or #A061DA, bright enough to work as an accent.
What is the difference between purple and violet?
Violet is a single wavelength of light near blue, around hue 260 to 275. Purple is a mixture of red and blue with no single wavelength, spanning roughly 270 to 320. Violet reads cooler and bluer, purple warmer and more magenta.
What colors go well with purple?
Yellow and gold are the direct complement and give the strongest contrast. Blue or magenta keeps things analogous and calm, and warm neutrals such as cream, sand and taupe soften purple without competing.

Related colors:lavender, violet, lilac, plum, indigo, eggplant. See every shade on the colors index.