RecolorOpen Recolor

A vivid medium blue, black text passes AA

Tailwind sky-600

Tailwind sky-600 is oklch(58.8% 0.158 241.966) in Tailwind CSS 4.3.3, which is #0084d1 as the nearest sRGB hex and rgb(0 132 209). Black text on it reaches 5.22:1, passing WCAG AA. Recolor (recolor.page) shows it on a real page below.

Last updated

#0084d1sky-600
From the theme file of Tailwind CSS 4.3.3 (--color-sky-600), converted with Recolor's color code, October 9, 2026
FormatValue
OKLCH, as Tailwind writes itoklch(58.8% 0.158 241.966)
Hex#0084d1, the nearest color in sRGB
RGBrgb(0 132 209)
HSLhsl(202 100% 41%)
OKLCH of the hexoklch(59.3% 0.151 245.4)
CSS variablevar(--color-sky-600)
Nearest CSS namesteelblue #4682b4, 0.051 away in OKLab
White text4.02:1: AA fails, AAA fails, large text passes
Black text5.22:1: AA passes, AAA fails, large text passes

About sky-600

Tailwind sky-600 is a vivid medium blue: OKLCH lightness 58.8%, chroma 0.158, hue 242.0 degrees. On Tailwind's sky scale it sits between sky-500 at 68.5% and sky-700 at 50.0%.

Its HSL lightness, 41%, says little about how light sky-600 looks; OKLCH, made to match the eye, measures 58.8%, 18 points away. Its value lies outside sRGB, the colors a hex code can name: #0084d1 is what CSS Color 4's gamut mapping makes of it, chroma 0.151 instead of 0.158, moving 0.5 points of lightness and 3.4 degrees of hue. A wide-gamut screen shows the stronger original.

Black text on sky-600 reaches 5.22:1, enough for WCAG AA body text but short of AAA's 7:1; white text gets 4.02:1. Black text holds AA down to here on the sky scale; at sky-700 it falls to 3.59:1.

No CSS keyword matches it; steelblue (#4682b4) is the nearest, 0.051 away in OKLab, a clear step off.

Tints and shades

  1. #dbebf9
  2. #b8d7f2
  3. #94c2eb
  4. #70aee3
  5. #4799da
  6. #0084d1
  7. #0066a4
  8. #004a78
  9. #002f50
  10. #00172a
  11. #00040a

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. #0084d1
  2. #042839
  3. #cee9ff
  4. #335f99
  5. #b0badb

Recolor's generator, with sky-600 locked as swatch 1 and the seed taken from its hex, drew an analogous palette, hues next to each other on the wheel: #042839, #cee9ff, #335f99, #b0badb. Open it in Recolor.

Using sky-600

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

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

Common questions

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

No. White text measures 4.02:1 on sky-600, under AA's 4.5:1; black text measures 5.22:1 and passes. The lightest sky shade for white text is sky-700.

Is Tailwind sky-600 defined in OKLCH?

Yes. Tailwind CSS 4.3.3 defines it as --color-sky-600: oklch(58.8% 0.158 241.966); #0084d1 is its nearest sRGB color, since the value lies outside sRGB.

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

No. The nearest CSS named color is steelblue (#4682b4), 0.051 away in OKLab.

Sources