How do I convert Tailwind classes to CSS?

Paste the Tailwind class string into the Tailwind to CSS tool for instant conversion. Each utility class maps to one or more standard CSS properties — for example, p-4 becomes padding: 1rem.

What does p-4 mean in Tailwind?

p-4 sets padding: 1rem (16px) on all sides. Tailwind's spacing scale uses 0.25rem increments, so the number 4 means 4 × 0.25rem = 1rem.

Can I use Tailwind classes in email templates?

No — email clients don't support Tailwind's utility approach. Convert Tailwind classes to inline CSS using the Tailwind to CSS tool, then apply the styles inline in your email HTML.

How to Convert Tailwind CSS Classes to Regular CSS

🔄

Try Tailwind to CSS

Free, no signup →