Tailwind v3 → v4 migration helper
Paste class strings, CSS entry files, or config snippets — get common v4 replacements and migration notes. Honest about limits: guidance, not a full upgrade compiler.
Your code never leaves the browser — no upload, no server.
Applies well-known renames (opacity → slash, flex-shrink → shrink, shadow/blur/rounded scale, ring width, important suffix, @tailwind → @import) and flags CSS-first @theme config. Review every change; plugins and custom themes need manual work.
Paste v3 markup or config, or load the example.
Migrated output
replacements applied
Replacements
No automatic replacements in this input — see notes below.
| From | To | Count |
|---|---|---|
Migration notes
About this tool
Covers the high-traffic v3→v4 class and CSS entry changes: slash opacity, flex-shrink/grow renames, overflow-ellipsis → text-ellipsis, shadow/blur/rounded scale shifts, outline-hidden, ring width, important suffix, and @import "tailwindcss" with @theme-oriented config notes.
For production upgrades, also check the official Tailwind upgrade guide and codemods — this page is a browser-side checklist helper.