Tailwind CSS · palette index
Every Tailwind default swatch,
in one page.
All 242 default colors from the Tailwind CSS v3 palette — every family, every stop from 50 to 950. Click any swatch for its conversions, framework snippets, nearest design-system matches, and accessibility ratings.
Jump to family
Pick your color.
Each family label below scrolls you to its row. Each row's swatches link through to a dedicated page with all conversions and snippets.
Families
The full palette.
Hover any swatch to see its hex code, click to open its landing page.
About this palette
Tailwind CSS v3 · 242 colors
Tailwind CSS ships with 22 color families by default: slate, gray, zinc, neutral, stone, red, orange, amber, yellow, lime, green, emerald, teal, cyan, sky, blue, indigo, violet, purple, fuchsia, pink, and rose. Each family has 11 stops — from 50 (the lightest tint) to 950 (the deepest shade) — so you have 242 hand-tuned values without touching a single CSS variable.
Every color on this page has its own landing at /tailwind/<family>-<step> with conversions (HEX, RGB, HSL, HSV, CMYK), copy-ready framework snippets (SwiftUI, Flutter, Compose, SCSS, arbitrary Tailwind), and the nearest CSS named color.