About This Tool
Documentation
What does this tool do?
A CSS migration engine that parses custom CSS declarations (colors, margins, padding, flexbox, grid, typography, borders) and maps them to their official Bootstrap 5 utility class equivalents (e.g. `display: flex` -> `d-flex`, `margin-top: 1rem` -> `mt-3`).
When should you use it?
Use this tool when migrating legacy custom CSS codebases into Bootstrap 5 frameworks, reducing stylesheet bloat by replacing custom classes with utility classes, or standardizing team CSS patterns.
Key Capabilities & Features
Highlights
Convert standard Vanilla CSS properties and selectors into Bootstrap 5 utility classes
Smart mapping for margins, paddings, flexbox, text alignment, colors, and display rules
Identifies custom CSS styles requiring dedicated classes and flags unsupported utilities
Side-by-side comparison showing raw CSS input alongside equivalent Bootstrap HTML markup
Clean export of refactored HTML with Bootstrap classes