CSS to Tailwind converter
Paste CSS declarations or a full rule block — get Tailwind v4 utility classes with spacing-scale snapping, arbitrary-value fallbacks, and a per-declaration mapping table.
Your CSS never leaves the browser — no upload, no server.
Tailwind classes
Mapping table
| Property | Value | Tailwind utility |
|---|---|---|
| no direct utility — keep as custom CSS |
Unmapped declarations
These properties have no direct Tailwind utility in this converter — keep them as custom CSS or arbitrary values.
About this tool
Rule-based mapping covers common layout, spacing, typography, color, border, flex, grid, and transition properties. Spacing snaps to the default 4px scale (4px = 1, 8px = 2, 16px = 4) with arbitrary[value] fallbacks. Colors map to arbitrary hex values — no palette guessing.
This is a starting point, not a perfect compiler. Complex selectors, pseudo-elements, and custom properties still belong in your CSS file.