CSS Framework Converter
Convert HTML between Bootstrap, Tailwind CSS, and vanilla CSS classes — instantly in your browser. Layout, typography, spacing, colors, and components all covered.
Convert HTML between Bootstrap, Tailwind CSS, and vanilla CSS classes — instantly in your browser. Layout, typography, spacing, colors, and components all covered.
This tool converts HTML class attributes between Bootstrap 5, Tailwind CSS, and vanilla CSS utility classes. It handles layout (flexbox, grid, containers), typography, spacing (margin/padding), colors, display utilities, and common component patterns like buttons, cards, badges, and alerts.
Bootstrap's d-flex becomes Tailwind's flex, justify-content-between becomes justify-between, mt-3 becomes mt-3 (compatible scale), and btn btn-primary becomes btn with Tailwind component classes.
Some Bootstrap components (modals, dropdowns, carousels) rely on JavaScript and data attributes that cannot be converted by class substitution alone. Tailwind's JIT classes and arbitrary values like [color:#ff0000] are preserved as-is when converting to Bootstrap or CSS.