Tailwind Purple
Purple is rich and slightly warmer than Violet — associated with creativity, imagination and premium brands. Great for bold accents and expressive marketing.
Click any value to copy it. All 11 Purple 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 Purple
- Bold accents:
bg-purple-600. - Tinted highlights:
bg-purple-100 text-purple-700. - Gradients with pink/fuchsia.
Related Tailwind colors
Build a full theme from Purple with the shadcn theme generator, or see the whole Tailwind colors palette.
Copied
