RecolorOpen Recolor

A vivid medium magenta, black and white text both pass AA

Tailwind fuchsia-600

The hex code of Tailwind fuchsia-600 is #c800de (rgb(200 0 222)), from its Tailwind CSS 4.3.3 value oklch(59.1% 0.293 322.896). White text on it reaches 4.66:1, passing WCAG AA; below, Recolor (recolor.page) puts it on a page.

Last updated

#c800defuchsia-600
From the theme file of Tailwind CSS 4.3.3 (--color-fuchsia-600), converted with Recolor's color code, October 9, 2026
FormatValue
OKLCH, as Tailwind writes itoklch(59.1% 0.293 322.896)
Hex#c800de, the nearest color in sRGB
RGBrgb(200 0 222)
HSLhsl(294 100% 44%)
OKLCH of the hexoklch(59.8% 0.283 322.8)
CSS variablevar(--color-fuchsia-600)
Nearest CSS namemediumorchid #ba55d3, 0.086 away in OKLab
White text4.66:1: AA passes, AAA fails, large text passes
Black text4.51:1: AA passes, AAA fails, large text passes

About fuchsia-600

Read as numbers, fuchsia-600 is lightness 59.1%, chroma 0.293 and hue 322.9 degrees; read by eye, it is a vivid medium magenta. Its neighbors on the fuchsia scale are fuchsia-500, 7.6 points lighter, and fuchsia-700, 7.3 points darker.

HSL puts its lightness at 44% and OKLCH at 59.1%, 16 points apart: HSL's lightness does not follow what the eye sees, OKLCH's is built to. A hex code cannot hold fuchsia-600 exactly: the value is outside sRGB, and #c800de is the CSS Color 4 gamut mapping of it, chroma lowered by 0.010, 0.7 points of lightness and 0.1 degrees of hue away from the value.

Black and white text both clear 4.5:1 on fuchsia-600, at 4.51:1 and 4.66:1: a rare middle ground where either ink meets WCAG AA. Fuchsia-600 is where the fuchsia scale turns over: lighter shades need black text, darker ones white, and this one takes either.

The nearest CSS named color, mediumorchid (#ba55d3), is 0.086 away in OKLab: related, but plainly a different color.

Tints and shades

  1. #f9dffc
  2. #f1bff8
  3. #e99df2
  4. #df7aec
  5. #d451e6
  6. #c800de
  7. #9c00ae
  8. #730080
  9. #4c0055
  10. #28002e
  11. #09000b

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. #c800de
  2. #b8f5e2
  3. #381316
  4. #ccd07c
  5. #664262

Around fuchsia-600 as swatch 1, Recolor's generator made a free palette, hues spread around the wheel: #b8f5e2, #381316, #ccd07c, #664262, drawn from a seed fixed by its hex. Open it in Recolor.

Using fuchsia-600

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

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

Common questions

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

Yes. White text measures 4.66:1 on fuchsia-600, above the 4.5:1 that WCAG AA asks of body text.

Is Tailwind fuchsia-600 defined in OKLCH?

Yes. Tailwind CSS 4.3.3 defines it as --color-fuchsia-600: oklch(59.1% 0.293 322.896); #c800de is its nearest sRGB color, since the value lies outside sRGB.

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

No. The nearest CSS named color is mediumorchid (#ba55d3), 0.086 away in OKLab.

Sources