RecolorOpen Recolor

A vivid dark purple, white text passes AA

Tailwind fuchsia-900

The hex code of Tailwind fuchsia-900 is #721378 (rgb(114 19 120)), from its Tailwind CSS 4.3.3 value oklch(40.1% 0.17 325.612). White text on it reaches 10.10:1, passing WCAG AAA; below, Recolor (recolor.page) puts it on a page.

Last updated

#721378fuchsia-900
From the theme file of Tailwind CSS 4.3.3 (--color-fuchsia-900), converted with Recolor's color code, October 9, 2026
FormatValue
OKLCH, as Tailwind writes itoklch(40.1% 0.17 325.612)
Hex#721378
RGBrgb(114 19 120)
HSLhsl(296 73% 27%)
CSS variablevar(--color-fuchsia-900)
Nearest CSS namepurple #800080, 0.032 away in OKLab
White text10.10:1: AA passes, AAA passes, large text passes
Black text2.08:1: AA fails, AAA fails, large text fails

About fuchsia-900

Read as numbers, fuchsia-900 is lightness 40.1%, chroma 0.170 and hue 325.6 degrees; read by eye, it is a vivid dark purple. Its neighbors on the fuchsia scale are fuchsia-800, 5.1 points lighter, and fuchsia-950, 10.8 points darker.

Its lightness is 27% in HSL and 40.1% in OKLCH, 13 points apart; only the second tracks how light it looks. No gamut mapping is needed here: oklch(40.1% 0.17 325.612) sits inside sRGB and #721378 matches it.

White on fuchsia-900 reads at 10.10:1, enough for AAA body text; black reaches 2.08:1 and should stay off it. On the fuchsia scale white text works from fuchsia-600 to fuchsia-950; fuchsia-900 has 3 shades of margin.

Of the named colors, purple (#800080) is the nearest, 0.032 away in OKLab; next to each other the two still differ.

Tints and shades

  1. #e8d8e9
  2. #d1b2d2
  3. #ba8cbc
  4. #a367a5
  5. #8b418f
  6. #721378
  7. #580c5d
  8. #3f0643
  9. #28032a
  10. #120114
  11. #030003

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

  1. #721378
  2. #d69bd3
  3. #291c28
  4. #ffdbff
  5. #b35fb4

Around fuchsia-900 as swatch 1, Recolor's generator made a monochromatic palette, one hue in five lightnesses: #d69bd3, #291c28, #ffdbff, #b35fb4, drawn from a seed fixed by its hex. Open it in Recolor.

Using fuchsia-900

Pair it with text-white, 10.10:1; fuchsia-900 as text on a white page measures the same ratio. In CSS it is var(--color-fuchsia-900).

HTML
<a class="bg-fuchsia-900 text-white" href="/start">Get started</a>
<p class="text-fuchsia-900">Text in fuchsia-900</p>

Common questions

Does white text pass WCAG AA on Tailwind fuchsia-900?

Yes. White text measures 10.10:1 on fuchsia-900, above the 4.5:1 that WCAG AA asks of body text, and above AAA's 7:1 too.

Is Tailwind fuchsia-900 defined in OKLCH?

Yes. Tailwind CSS 4.3.3 defines it as --color-fuchsia-900: oklch(40.1% 0.17 325.612); #721378 is its conversion to sRGB.

Is there a CSS named color for Tailwind fuchsia-900?

No. The nearest CSS named color is purple (#800080), 0.032 away in OKLab.

Sources