Eleven shades, from lime-50 to lime-950

Tailwind lime colors

Tailwind CSS 4.3.3 defines eleven lime shades in OKLCH, from lime-50 (#f7fee7) to lime-950 (#192e03). On them white text passes WCAG AA from lime-700 to lime-950, and black text from lime-50 to lime-600. Recolor (recolor.page) shows the scale on a real page.

Last updated

  1. 50#f7fee7
  2. 100#ecfcca
  3. 200#d8f999
  4. 300#bbf451
  5. 400#9ae600
  6. 500#7ccf00
  7. 600#5ea500
  8. 700#497d00
  9. 800#3d6300
  10. 900#35530e
  11. 950#192e03
From the theme file of Tailwind CSS 4.3.3, converted with Recolor's color code, October 9, 2026; contrast as WCAG 2.2 defines it
ShadeOKLCHHexWhite textBlack text
lime-50oklch(98.6% 0.031 120.757)#f7fee71.04:1 fails20.29:1 passes
lime-100oklch(96.7% 0.067 122.328)#ecfcca1.09:1 fails19.34:1 passes
lime-200oklch(93.8% 0.127 124.321)#d8f9991.17:1 fails17.93:1 passes
lime-300oklch(89.7% 0.196 126.665)#bbf4511.30:1 fails16.17:1 passes
lime-400oklch(84.1% 0.238 128.85)#9ae6001.53:1 fails13.69:1 passes
lime-500oklch(76.8% 0.233 130.85)#7ccf001.95:1 fails10.78:1 passes
lime-600oklch(64.8% 0.2 131.684)#5ea5003.06:1 fails6.86:1 passes
lime-700oklch(53.2% 0.157 131.589)#497d004.98:1 passes4.22:1 fails
lime-800oklch(45.3% 0.124 130.933)#3d63007.04:1 passes2.98:1 fails
lime-900oklch(40.5% 0.101 131.063)#35530e8.77:1 passes2.40:1 fails
lime-950oklch(27.4% 0.072 132.109)#192e0314.65:1 passes1.43:1 fails

Text on lime, and lime as text

As a text color the rule turns around: lime text on a white page passes AA from lime-700 on, and on a black page up to lime-600, since a contrast ratio is the same whichever color is in front.

Chroma peaks at lime-400 (0.238) and falls toward both ends, while the hue drifts 11.4 degrees across the scale.

5 of the eleven lie outside sRGB, so their hex codes are the nearest sRGB colors, and a wide-gamut screen shows them stronger.

Sources