Sortwind
Logo de Sortwind

Tailwind Classes Organizer

Order and remove duplicates from your Tailwind classes with this Visual Studio Code extension.

Classes Ordering

Order the Tailwind CSS classes of your selected code file when saving changes.

Here is an example of how the TailwindCSS classes of this example button are ordered:

You can also order your Tailwind classes using the command Ctrl + Shift + S.

* Video demonstration of how TailwindCSS classes are ordered.

Duplicates Removal

* Video demonstration of how duplicates of TailwindCSS classes are removed.

Remove duplicates from the Tailwind CSS classes of your current code file when saving changes.

Here is an example of how the duplicates of the TailwindCSS classes in an example button are removed.

Settings

You can configure the extension to your liking using the following settings in your settings.json file in VS Code.
You can access it by pressing Ctrl + ,

Configure the extension to suit your needs using sortwind.{property}

runOnSave

Type: boolean

Default: true

Order the TailwindCSS classes of your current file when saving changes.

removeDuplicates

Type: boolean

Default: true

Remove duplicates from the TailwindCSS classes of your current code file when saving changes.

order

Type: array

Default: ['aspect-auto','aspect-video', ...]

Array with the order of the TailwindCSS classes.
You can change the order to your liking!

classRegex

Type: object

Default: {'html':'\bclass\...'}

Regular expression to find TailwindCSS classes in different languages.
You can add the regex of the language you like the most!

About Us

Juan Manuel Suárez

Juan Manuel Suárez

FrontEnd Developer

Miguel A. Martínez

Miguel A. Martínez

BackEnd Developer

We are two developers who have created this extension as a final project for Web Applications Development to help other developers keep their Tailwind CSS classes ordered and without duplicates.

If you have any suggestions and/or problems, do not hesitate to open an issue on our GitHub.

Thank you for using our extension!