Convert CSS properties to Tailwind CSS utility classes instantly
| CSS Property | Example Value | Tailwind Class |
|---|---|---|
| display: flex | flex | flex |
| padding | 16px | p-4 |
| margin-top | 8px | mt-2 |
| font-size | 18px | text-lg |
| border-radius | 8px | rounded-lg |
| text-align | center | text-center |
| position | relative | relative |
| width | 100% | w-full |
The converter covers 80+ common CSS properties with their direct Tailwind equivalents. Properties with non-standard or custom values may need Tailwind arbitrary value syntax like [value].
It supports display, flexbox, grid, spacing, colors, typography, borders, shadows, transforms, and more. Very niche properties will show a suggestion or the original CSS.
Yes! Paste full CSS with selectors. The tool parses each rule block and converts all properties, showing results organized by selector.