Purple family
Mauve color
A light, soft purple with cool undertones. The reference mauve is #E0B0FF, as defined by the Color Names (meodai).
| HEX | #E0B0FF | |
|---|---|---|
| RGB | rgb(224, 176, 255) | |
| HSL | hsl(276, 100%, 85%) | |
| HSV | hsv(276, 31%, 100%) | |
| OKLCH | oklch(82.7% 0.119 311.6) | |
| CMYK* | 12, 31, 0, 0 |
* CMYK is a simple conversion without a print profile; ask your printer for exact values.
What color is mauve?
Mauve is named after the French word for the mallow flower and became famous through mauveine, the first synthetic dye, discovered by William Perkin in 1856. The word now means two different colours: a pale purple, shown first, and a dusky grayish pink, which is what most people chose for mauve in the xkcd survey.
Mauve hex codes by source
Color names are not standardized, so the same name can point to different colors. Here is every definition of mauve in our three sources, with how close each one is to the reference.
| Name | HEX | Source | Compared with the reference |
|---|---|---|---|
| Mauve | #AE7181 | xkcd Color Survey | Noticeably different · 8% similar |
| Mauve | #E0B0FF | Color Names (meodai) | Reference shown on this page |
Mauve vs Dusty Rose
#E0B0FF
#C0737A
Dusty rose is pinker; the survey mauve is almost the same colour, while the pale-purple mauve is far from it. In numbers: the two are 13% similar (OKLab distance 0.219). See Dusty Rose for its own codes.
Colors similar to mauve
The closest named colors to #E0B0FF across all three sources, with their similarity in OKLab.
Tints and shades of mauve
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 mauve
Classic color-wheel combinations built on #E0B0FF, computed in OKLCH so the partners keep the same lightness and intensity. Each swatch shows the nearest common name.
Complementary
Analogous
Triadic
Split complementary
Mauve 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 mauve background, black text is the better choice.
Use mauve in CSS
.mauve {
color: #E0B0FF;
/* or */ color: rgb(224 176 255);
/* or */ color: hsl(276 100% 85%);
/* or */ color: oklch(82.7% 0.119 311.6);
}