Tailwind Sky
All 11 Sky shades, 50 to 950 — click any value to copy it as hex, OKLCH, RGB, HSL or class name.
Sky is a friendly, lighter blue — softer and more optimistic than the core Blue. It works well for links, informational states and airy marketing sections.
Click any value to copy it. All 11 Sky shades (50–950) in hex, OKLCH, RGB, HSL and Tailwind class.
| Swatch | Shade | Class | Hex | OKLCH | RGB | HSL |
|---|---|---|---|---|---|---|
| 50 | ||||||
| 100 | ||||||
| 200 | ||||||
| 300 | ||||||
| 400 | ||||||
| 500 | ||||||
| 600 | ||||||
| 700 | ||||||
| 800 | ||||||
| 900 | ||||||
| 950 |
What is Tailwind Sky?
Tailwind Sky is one of the 22 default color families in Tailwind CSS, published as 11 shades running from sky-50 (lightest) to sky-950 (darkest). Tailwind CSS v4 defines every shade in OKLCH, with a hex fallback for older browsers. Reach them through utility classes such as bg-sky-500, text-sky-700 and border-sky-200 — no config needed.
Where to use Tailwind Sky
- Info banners:
bg-sky-50 text-sky-800 border-sky-200. - Friendly links:
text-sky-600. - Soft CTAs:
bg-sky-500.
Related Tailwind colors
Related tools
- Tailwind Colors — the full palette, all 22 families and 242 shades.
- Shadcn Theme Generator — turn Sky into light and dark shadcn tokens.
- OKLCH Converter — convert any Sky hex to OKLCH, RGB or HSL.
- Color Shades Generator — turn your own brand color into an OKLCH tint and shade scale.
Copied
