Tailwind to CSS
Paste Tailwind classes — get a CSS block, a per-class mapping table, and warnings for anything outside this tool's rule-based subset.
Your classes never leave the browser — no upload, no server.
Supported subset (rule-based)
Not a full Tailwind compiler — plugins, custom theme tokens, and many advanced utilities will show as unsupported.
Paste classes or load the example to see CSS output.
No supported classes mapped yet — see unsupported warnings below.
CSS output
Per-class mappings
| Class | CSS | Note |
|---|---|---|
| unsupported |
Unsupported warnings
These classes are outside the supported subset — keep them as Tailwind or write custom CSS.
About this tool
Converts a space-separated list of Tailwind utilities into plain CSS declarations using a fixed mapping table (default spacing scale, common layout/typography utilities, and the default color palettes). Slash opacity (e.g. bg-slate-900/50) becomes an 8-digit hex orcolor-mix where possible.
Variants like hover: / sm: are noted but only the base declaration is emitted. This is guidance for learning and migration — not a replacement for the Tailwind build.