🎨 Tailwind Color Reference
Browse and preview the complete Tailwind CSS color palette with hex codes.
About Tailwind Color Reference
Complete reference for Tailwind CSS color palette including all shades (50-950). Browse colors by name, preview them visually, and copy hex codes for use in any project.
Features
- All Tailwind colors and shades
- Visual preview grid
- Copy hex codes
Frequently Asked Questions
How many colors are in Tailwind CSS?
Tailwind CSS includes 22+ named colors (slate, gray, red, orange, amber, yellow, lime, green, emerald, teal, cyan, sky, blue, indigo, violet, purple, fuchsia, pink, rose) with 10-11 shades each.
What do Tailwind shade numbers mean?
Shade 50 is lightest, 950 is darkest. 500 is the base/default shade. Each shade is 10-15% different in luminance from the next for consistent scaling.
Can I use Tailwind colors without Tailwind?
Yes, our reference provides raw hex codes for every Tailwind color. Use them in any CSS project by copying the hex values directly.