RecolorOpen Recolor

A pale yellow, black text passes AA

Tailwind lime-50

In Tailwind CSS 4.3.3, lime-50 is defined as oklch(98.6% 0.031 120.757); in hex that is #f7fee7, or rgb(247 254 231). Black text on it reaches 20.29:1, passing WCAG AAA, and Recolor (recolor.page) can show it on a real page.

Last updated

#f7fee7lime-50
From the theme file of Tailwind CSS 4.3.3 (--color-lime-50), converted with Recolor's color code, October 9, 2026
FormatValue
OKLCH, as Tailwind writes itoklch(98.6% 0.031 120.757)
Hex#f7fee7
RGBrgb(247 254 231)
HSLhsl(78 92% 95%)
CSS variablevar(--color-lime-50)
Nearest CSS namehoneydew #f0fff0, 0.013 away in OKLab
White text1.04:1: AA fails, AAA fails, large text fails
Black text20.29:1: AA passes, AAA passes, large text passes

About lime-50

In OKLCH, lime-50 has a lightness of 98.6%, a chroma of 0.031 and a hue of 120.8 degrees, which makes it a pale yellow. It opens the lime scale as its lightest shade, 1.9 points of lightness above lime-100.

HSL and OKLCH agree on how light it is, 95% and 98.6%. The value lies inside sRGB, the gamut of a hex code, so lime-50 converts to #f7fee7 without losing chroma.

For text, lime-50 wants black: 20.29:1 clears even AAA's 7:1, and white at 1.04:1 fails AA. Black text passes on every lime shade from lime-50 to lime-600, 6 shades darker than lime-50.

Its nearest CSS named color, honeydew (#f0fff0), is 0.013 away in OKLab, too close to tell apart by eye.

Tints and shades

  1. #fefffb
  2. #fcfff7
  3. #fbfff3
  4. #fafeef
  5. #f8feeb
  6. #f7fee7
  7. #c2c7b5
  8. #8f9386
  9. #606359
  10. #343630
  11. #0e0f0c

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. #f7fee7
  2. #8b8db9
  3. #1b1e34
  4. #b4b9ea
  5. #51566f

Locked as the first of five swatches, lime-50 gets #8b8db9, #1b1e34, #b4b9ea, #51566f from Recolor's generator, a monochromatic palette, one hue in five lightnesses. The seed is its hex, so the palette stays the same. Open it in Recolor.

Using lime-50

Pair it with text-black, 20.29:1; lime-50 as text on a black page measures the same ratio. In CSS it is var(--color-lime-50).

HTML
<a class="bg-lime-50 text-black" href="/start">Get started</a>
<p class="text-lime-50">Text in lime-50</p>

Common questions

Does white text pass WCAG AA on Tailwind lime-50?

No. White text measures 1.04:1 on lime-50, under AA's 4.5:1; black text measures 20.29:1 and passes. The lightest lime shade for white text is lime-700.

Is Tailwind lime-50 defined in OKLCH?

Yes. Tailwind CSS 4.3.3 defines it as --color-lime-50: oklch(98.6% 0.031 120.757); #f7fee7 is its conversion to sRGB.

Is there a CSS named color for Tailwind lime-50?

Yes, nearly: honeydew (#f0fff0) is 0.013 away in OKLab, too close to tell apart by eye.

Sources