OKLCH Studio · Tailwind v3 → v4

Tailwind sky-800: v3 #075985 vs v4 oklch(0.443 0.110 240.8)

Subtle shiftIn v4, sky-800 is more saturated than in v3 (ΔL 0.000, ΔC +0.010, ΔH 0.0°).

The v4 value is outside the sRGB gamut, so #00598A is a clipped sRGB approximation; wide-gamut displays can show it more vivid.

Tailwind v3#075985
Tailwind v4oklch(0.443 0.110 240.8)
Tailwind sky-800 values in v3 and v4
v3 hex#075985
v3 as oklch()oklch(0.443 0.100 240.8)
v4 oklch()oklch(0.443 0.110 240.8)
v4 hex#00598A
ΔE-OK (×100)1.00
ΔL (v4 − v3)0
ΔC (v4 − v3)0.01
ΔH (v4 − v3)0°

Copy code

Tailwind v3 usage

color: #075985;

// tailwind.config.js (v3)
colors.sky[800] // #075985

Tailwind v4 @theme token

@theme {
  --color-sky-800: oklch(0.443 0.110 240.8);
}

.example {
  color: var(--color-sky-800);
}

Keep the v3 colour in v4

@theme {
  --color-sky-800: #075985;
}

Related

← All Tailwind v3 to v4 colors