Tailwind Violet
Violet is a balanced blue-purple that feels modern and creative. It's a go-to accent for AI, design and premium products, and anchors many popular gradients.
Click any value to copy it. All 11 Violet 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 Violet
- Creative primary:
bg-violet-600. - Gradients:
from-violet-500 to-fuchsia-500. - Accent text:
text-violet-600.
Related Tailwind colors
Build a full theme from Violet with the shadcn theme generator, or see the whole Tailwind colors palette.
Copied
