Tailwind CSS 3 to 4 Converter

Automatically upgrade your Tailwind CSS v3 code to v4 with all breaking changes handled.

Tailwind CSS v3 Input

Tailwind CSS v4 Output

0
Changes Made
0
Warnings
0
Deprecated Classes

How It Works

1

Paste v3 Code

Paste your existing Tailwind CSS v3 class names or utility classes into the input area.

2

Auto-Convert

The tool detects renamed, removed, and changed classes and maps them to their v4 equivalents.

3

Review & Use

Review the migration report, copy the converted code, and apply it to your project.

Features

Class Mapping

Automatically maps renamed classes like bg-opacity-* to new v4 syntax.

Deprecation Warnings

Highlights deprecated classes that need manual review or alternative approaches.

Migration Report

Detailed report showing every change, warning, and deprecated class found.

Instant Conversion

Process hundreds of class names in milliseconds with real-time feedback.

Copied to clipboard!

Watch How It Works