Color family
Shades of purple
A dark, rich purple with cool undertones. The reference purple is #800080, as defined by the CSS named color.
| HEX | #800080 | |
|---|---|---|
| RGB | rgb(128, 0, 128) | |
| HSL | hsl(300, 100%, 25%) | |
| HSV | hsv(300, 100%, 50%) | |
| OKLCH | oklch(42.1% 0.193 328.4) | |
| CMYK* | 0, 100, 0, 50 |
* CMYK is a simple conversion without a print profile; ask your printer for exact values.
What color is purple?
Purple is a mix of red and blue. Unlike violet, it does not appear in the rainbow as a single wavelength. For centuries it was the colour of emperors because Tyrian purple dye, made from sea snails, was extremely expensive. The CSS keyword purple is a dark, reddish purple, #800080.
Purple hex codes by source
Color names are not standardized, so the same name can point to different colors. Here is every definition of purple in our three sources, with how close each one is to the reference.
| Name | HEX | Source | Compared with the reference |
|---|---|---|---|
| Purple | #800080 | CSS named color | Reference shown on this page |
| Purple | #7E1E9C | xkcd Color Survey | Close · 79% similar |
| Purple | #800080 | Color Names (meodai) | Same color |
Purple vs Violet
#800080
#9A0EEA
Violet is bluer and is a real spectral colour; purple is a red and blue mixture. In numbers: the two are 30% similar (OKLab distance 0.174). See Violet for its own codes.
Named shades of purple
97 names in the CSS keywords and the xkcd Color Survey belong to the purple family. They are sorted from light to dark; click a swatch to copy its code, or open the ones with their own page.
Light purple shades 17
Medium purple shades 49
Dark purple shades 31
Tints and shades of purple
The same hue from light to dark, generated in OKLab so the steps look even. Click a step to copy its HEX code.
Colors that go with purple
Classic color-wheel combinations built on #800080, computed in OKLCH so the partners keep the same lightness and intensity. Each swatch shows the nearest common name.
Complementary
Analogous
Triadic
Split complementary
Purple with white and black text
WCAG asks for a contrast of at least 4.5:1 for body text (AA) and 3:1 for large text. On a purple background, white text is the better choice.
Use purple in CSS
.purple {
color: #800080;
/* or */ color: rgb(128 0 128);
/* or */ color: hsl(300 100% 25%);
/* or */ color: oklch(42.1% 0.193 328.4);
/* CSS keyword */ color: purple;
}