TailCon

TailCon is a VS Code extension designed to convert CSS styles into Tailwind classes. It's tailored for developers who want to shift to Tailwind's utility-first approach without the hassle of manually rewriting existing CSS.

Ideal for both Tailwind beginners and regular users, TailCon helps to quickly convert from your CSS styles to the corresponding Tailwind utilities, enhancing productivity and code maintainability.

Conversions are for Tailwind version 3.3.5

Features

• Convert JSX Styles: Select the JSX component (do not select children) and run the command.

Commands

Example

Requirements

This extension has no specific requirements or dependencies.

Extension Settings

Currently, the CSS to Tailwind Converter does not add specific settings in VS Code.

Known Issues

These are the known issues:

• Tailwind.config is not used, everything is converted using the base Tailwind configuration.
• Some utility conversions are not converted, if they use more than one property,such as truncate.
• If you can't do it using inline-styles, you cannot convert to the Tailwind utility, such as Divide Width.

Release Notes

1.1.1

• Fix: Space before selected element not converting

1.1.0

• Fix: Handling multiple values for CSS property
• Fix: Width and Height attributes adding extra prefix
• Fix: classNames were not being added when missing styles

1.0.0

• Initial release of CSS to Tailwind Converter
• Feature: Convert JSX styles to Tailwind classes