A vivid medium magenta, black text passes AA
What color is fuchsia?
The CSS named color fuchsia is #ff00ff, or rgb(255 0 255): a vivid medium magenta in plain words. Black text on it reaches 6.70:1, passing WCAG AA, and Recolor (recolor.page) can put it on a real page.
Last updated
| Format | Value |
|---|---|
| Keyword | fuchsia, the same as magenta |
| Hex | #ff00ff |
| RGB | rgb(255 0 255) |
| HSL | hsl(300 100% 50%) |
| OKLCH | oklch(70.2% 0.322 328.4) |
| Nearest Tailwind color | fuchsia-500 #e12afb, 0.056 away in OKLab |
| White text | 3.14:1: AA fails, AAA fails, large text passes |
| Black text | 6.70:1: AA passes, AAA fails, large text passes |
About fuchsia
In OKLCH terms fuchsia has a lightness of 70.2%, a chroma of 0.322 and a hue of 328.4 degrees, a vivid medium magenta to the eye. It shares its value with magenta: two keywords, one color. CSS Color 4 counts it among the 16 names that came from the VGA palette and then HTML; most of the other names came from the X11 color system.
Its HSL lightness, 50%, says little about how light fuchsia looks; OKLCH, made to match the eye, measures 70.2%, 20 points away. CSS has no keyword in its neighborhood; orchid (#da70d6) is the nearest, a long 0.141 away in OKLab.
With black text, fuchsia passes AA at 6.70:1. White text, at 3.14:1, does not. Its neighbors in the hue-sorted list of names are orchid and magenta.
The closest Tailwind 4.3.3 color is fuchsia-500, 0.056 away in OKLab, so bg-fuchsia-500 comes near; bg-[#ff00ff] gives the color itself.
Tints and shades
- #ffe2ff
- #ffc5ff
- #ffa6ff
- #ff84ff
- #ff5bff
- #ff00ff
- #c800c8
- #940094
- #630063
- #360036
- #0f000f
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
- #ff00ff
- #271625
- #c4cd95
- #782d71
- #bde5db
Locked as the first of five swatches, fuchsia gets #271625, #c4cd95, #782d71, #bde5db from Recolor's generator, a split-complementary palette, built on the two hues beside its opposite. The seed is its hex, so the palette stays the same. Open it in Recolor.
Using fuchsia
As a text color, fuchsia on a black page gives the same 6.70:1.
.notice {
background-color: fuchsia; /* #ff00ff */
color: black; /* 6.70:1 */
}Common questions
Does white text pass WCAG AA on fuchsia?
No. White text measures 3.14:1 on fuchsia, under AA's 4.5:1; black text measures 6.70:1 and passes.
Can fuchsia be written in OKLCH?
Yes: oklch(70.2% 0.322 328.4), computed from #ff00ff. A named color is an sRGB color, so its OKLCH value converts back to the same hex.
Is there a named color close to fuchsia?
No. The nearest, orchid (#da70d6), is 0.141 away in OKLab, a different color.