Tailwind Neutral
Neutral is Tailwind's pure achromatic gray — no hue at all. Choose it when you want colours to stay perfectly true and let your accent do all the talking, common in editorial and photography sites.
Click any value to copy it. All 11 Neutral 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 |
Where to use Tailwind Neutral
- Truly neutral backgrounds:
bg-neutral-100/bg-neutral-900. - Text:
text-neutral-900/text-neutral-100. - Subtle borders:
border-neutral-200.
Related Tailwind colors
Build a full theme from Neutral with the shadcn theme generator, or see the whole Tailwind colors palette.
Copied
