A vivid light magenta, black text passes AA
What color is violet?
The CSS named color violet is #ee82ee, or rgb(238 130 238): a vivid light magenta in plain words. Black text on it reaches 9.06:1, passing WCAG AAA, and Recolor (recolor.page) can put it on a real page.
Last updated
| Format | Value |
|---|---|
| Keyword | violet |
| Hex | #ee82ee |
| RGB | rgb(238 130 238) |
| HSL | hsl(300 76% 72%) |
| OKLCH | oklch(76.2% 0.186 327.2) |
| Nearest Tailwind color | fuchsia-400 #ed6bff, 0.057 away in OKLab |
| White text | 2.32:1: AA fails, AAA fails, large text fails |
| Black text | 9.06:1: AA passes, AAA passes, large text passes |
About violet
Measured in OKLCH, violet comes out at lightness 76.2%, chroma 0.186 and hue 327.2 degrees: a vivid light magenta.
Here HSL's lightness, 72%, lands near OKLCH's 76.2%, which is not true of every color. No CSS keyword matches it; orchid (#da70d6) is the nearest, 0.060 away in OKLab, a clear step off.
Black on violet reads at 9.06:1, enough for AAA body text; white reaches 2.32:1 and should stay off it. Its neighbors in the hue-sorted list of names are plum and orchid.
The closest Tailwind 4.3.3 color is fuchsia-400, 0.057 away in OKLab, so bg-fuchsia-400 comes near; bg-[#ee82ee] gives the color itself.
Tints and shades
- #feebfd
- #fcd7fb
- #f9c3f8
- #f6aef5
- #f298f2
- #ee82ee
- #bb65bb
- #8a498a
- #5c2f5c
- #321632
- #0d030d
From light to dark: 5 toward white and 5 toward black, mixed in OKLCH a sixth of the way at a time with the hue kept. A step that would repeat its neighbor is left out.
A palette around it
- #ee82ee
- #23643b
- #f2d4f0
- #37223a
- #ad5dbb
Around violet as swatch 1, Recolor's generator made a complementary palette, built on the hue opposite: #23643b, #f2d4f0, #37223a, #ad5dbb, drawn from a seed fixed by its hex. Open it in Recolor.
Using violet
As a text color, violet on a black page gives the same 9.06:1.
.notice {
background-color: violet; /* #ee82ee */
color: black; /* 9.06:1 */
}Common questions
Does white text pass WCAG AA on violet?
No. White text measures 2.32:1 on violet, under AA's 4.5:1; black text measures 9.06:1 and passes.
Can violet be written in OKLCH?
Yes: oklch(76.2% 0.186 327.2), computed from #ee82ee. A named color is an sRGB color, so its OKLCH value converts back to the same hex.
Is there a named color close to violet?
No. The nearest, orchid (#da70d6), is 0.060 away in OKLab, a different color.