DOM to Tailwind - VS Code Extension Extension Demo Visual Studio Marketplace Version Installs Rating License Convert HTML with inline CSS to Tailwind utility classes directly in your VS Code editor. Features One-click conversion of selected HTML or entire files Context menu integration for quick access Customizable prefixing (e.g., tw- prefix) Progress indicators during conversion Comprehensive CSS support including: Margins, padding, widths Colors and backgrounds Typography and text styling Flexbox and grid layouts Borders and positioning Installation Open Extensions in VS Code (Ctrl+Shift+X / Cmd+Shift+X) Search for "DOM to Tailwind" Click Install Reload VS Code when prompted Direct install link Usage Convert Selection Select HTML with inline styles in your editor Right-click and choose Convert Selection to Tailwind or - Press Ctrl+Shift+P (Cmd+Shift+P on Mac) and run DOM to Tailwind: Convert Selection Convert Entire File Open an HTML file Press Ctrl+Shift+P (Cmd+Shift+P on Mac) Run DOM to Tailwind: Convert File Example Before: html Hello World html Hello World json { "domToTailwind.usePrefix": false, "domToTailwind.prefix": "tw-", "domToTailwind.remInPx": 16, "domToTailwind.ignoreClasses": ["existing-class"], "domToTailwind.customUtilityMap": { "margin-2px": "m-0.5", "custom-bg": "bg-custom" }, "domToTailwind.includeComments": false } Settings Explained Setting Description Default usePrefix Add prefix to all utility classes false prefix Prefix to use when enabled "tw-" remInPx Base rem value for pixel conversion 16 ignoreClasses Classes to preserve during conversion [] customUtilityMap Custom CSS to Tailwind mappings {} includeComments Include conversion comments in output false Keyboard Shortcuts Add these to your keybindings.json for quick access: json [ { "command": "dom-to-tailwind.convertSelection", "key": "ctrl+alt+t", "mac": "cmd+alt+t", "when": "editorHasSelection" }, { "command": "dom-to-tailwind.convertFile", "key": "ctrl+alt+shift+t", "mac": "cmd+alt+shift+t" } ] Known Limitations Complex CSS selectors in |