A vivid medium violet, white text passes AA
What color is darkviolet?
darkviolet is a vivid medium violet: #9400d3 in hex, rgb(148 0 211). White text on it reaches 6.56:1, passing WCAG AA. Recolor (recolor.page) shows it on a real page below.
Last updated
| Format | Value |
|---|---|
| Keyword | darkviolet |
| Hex | #9400d3 |
| RGB | rgb(148 0 211) |
| HSL | hsl(282 100% 41%) |
| OKLCH | oklch(51.5% 0.261 309.8) |
| Nearest Tailwind color | purple-700 #8200db, 0.041 away in OKLab |
| White text | 6.56:1: AA passes, AAA fails, large text passes |
| Black text | 3.20:1: AA fails, AAA fails, large text passes |
About darkviolet
A vivid medium violet is the plain description of darkviolet: OKLCH lightness 51.5%, chroma 0.261, hue 309.8 degrees.
HSL calls its lightness 41%, OKLCH 51.5%: 10 points between a formula and a measure of what the eye sees. The closest CSS named color is darkorchid (#9932cc), 0.043 away in OKLab: near, and still a visible step from it side by side.
White text on darkviolet reaches 6.56:1, enough for WCAG AA body text but short of AAA's 7:1; black text gets 3.20:1. In the hue-sorted table of named colors it sits between blueviolet and rebeccapurple.
In Tailwind CSS 4.3.3 the nearest default color is purple-700 (#8200db), 0.041 away in OKLab; for the exact color, an arbitrary value such as bg-[#9400d3] works.
Tints and shades
- #edddfb
- #dbbbf5
- #c998ee
- #b874e6
- #a64cdd
- #9400d3
- #7300a5
- #54007a
- #360051
- #1b002b
- #05000a
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
- #9400d3
- #cec0dd
- #292030
- #e4d5f3
- #8f77aa
Recolor's generator, with darkviolet locked as swatch 1 and the seed taken from its hex, drew a monochromatic palette, one hue in five lightnesses: #cec0dd, #292030, #e4d5f3, #8f77aa. Open it in Recolor.
Using darkviolet
As a text color, darkviolet on a white page gives the same 6.56:1.
.notice {
background-color: darkviolet; /* #9400d3 */
color: white; /* 6.56:1 */
}Common questions
Does white text pass WCAG AA on darkviolet?
Yes. White text measures 6.56:1 on darkviolet, above the 4.5:1 that WCAG AA asks of body text.
Can darkviolet be written in OKLCH?
Yes: oklch(51.5% 0.261 309.8), computed from #9400d3. A named color is an sRGB color, so its OKLCH value converts back to the same hex.
Is there a named color close to darkviolet?
Yes: darkorchid (#9932cc) is the nearest, 0.043 away in OKLab, then blueviolet at 0.043.