prettier-plugin-tailwindcss vs Tailwind CSS IntelliSense in 2026

Q: Do prettier-plugin-tailwindcss and Tailwind CSS IntelliSense work with the newest Tailwind CSS?

The plugin's page names Tailwind CSS v3.0+ . Check each tool's own page for its current version notes before you install, since these may change. NormWind's claims say it works with Tailwind CSS v4 projects .

Compare prettier-plugin-tailwindcss and Tailwind CSS IntelliSense on what each does, cost, setup and what to check, with NormWind as a third option.

By SayDeploy · 2026-10-24

SayDeploy is published by LunarWerx, which makes some of the tools compared here.

prettier-plugin-tailwindcss automatically sorts Tailwind classes in its recommended order ^[1]. Tailwind CSS IntelliSense gives Visual Studio Code users autocomplete, syntax highlighting and linting ^[2]. NormWind is a third option that finds class pairs which can be written shorter ^[3].

Option	Price	Install or activation	Tailwind version named
prettier-plugin-tailwindcss	Not published	Prettier v3 required, ESM-only as of v0.5.x ^[1]	Tailwind CSS v3.0+ ^[1]; for v4 you must name your CSS file entry point ^[1]
Tailwind CSS IntelliSense	Not published	Needs tailwindcss installed to activate ^[2]	v4 and later needs a CSS file importing a Tailwind stylesheet ^[2]; v3 and earlier can use a config file ^[2]
NormWind	Free with no paid tier ^[3]	From npm as a dev dependency, or with npx ^[3]	Tailwind CSS v4 projects ^[3]

The short answer

prettier-plugin-tailwindcss is a Prettier plugin that automatically sorts Tailwind classes based on its recommended class order ^[1]. Tailwind CSS IntelliSense is an extension for Visual Studio Code users that adds autocomplete, syntax highlighting and linting ^[2]. NormWind finds Tailwind class pairs like px-4 py-4 that can be written as one shorthand like p-4 ^[3].

If you need automatic sorting, the plugin's page covers it ^[1], and it can also sort extra attributes ^[1]. IntelliSense's page covers keeping autocomplete working in CSS files that use Tailwind's special rules ^[2] and a default set of class attributes for completion and linting ^[2]. NormWind's claims cover shorthand findings ^[3], a check that can fail a CI job ^[3] and a GitHub Action that annotates pull requests ^[3].

What each tool is built for

prettier-plugin-tailwindcss. Its page calls it a Prettier v3+ plugin for Tailwind CSS v3.0+ that automatically sorts classes ^[1]. You can add extra attribute names for the plugin to sort ^[1]. It can also sort classes in tagged template literals ^[1]. The plugin lets you use its class sorting outside Prettier ^[1].

Tailwind CSS IntelliSense. Its page says it gives Visual Studio Code users autocomplete, syntax highlighting and linting ^[2]. It keeps full CSS autocomplete working when you use Tailwind's special rules ^[2]. Default class attributes for completion and linting are class, className, ngClass and class:list ^[2].

What NormWind is built for

NormWind is made by the team that publishes this site.

It finds Tailwind class pairs like px-4 py-4 that can be written as one shorthand like p-4 ^[3]. It flags arbitrary values like rounded-[24px] that match a named Tailwind utility like rounded-3xl, using Tailwind's own engine for that check ^[3].

It can rewrite findings automatically in Vue, Svelte, Astro and HTML files, and in JS, TS, JSX and TSX files too ^[3]. A dry run shows which files a fix would change, without writing them to disk ^[3]. Before merging classes it compares the generated CSS before and after, and skips the merge if they differ ^[3].

For CI, output can be text, JSON or SARIF 2.1.0 for GitHub code scanning ^[3]. It ships as a GitHub Action that annotates pull requests inline ^[3]. A setting limits reports to findings on lines changed since a git ref such as origin/main ^[3], and a baseline records current per-file finding counts so only new findings fail CI ^[3].

Pricing and fees

The facts given here state no price for prettier-plugin-tailwindcss, so its price is not published here. The same holds for Tailwind CSS IntelliSense: no price is stated in the facts here, so it is not published here. Check each tool's own page for current terms.

NormWind is free with no paid tier ^[3]. It uses an MIT licence ^[3].

None of the three sources here describe a fee charged on top of another service.

Setting it up and daily use

prettier-plugin-tailwindcss. As of v0.5.x, the plugin requires Prettier v3 and is ESM-only ^[1]. If a local Tailwind configuration file cannot be found, it falls back to the default Tailwind configuration ^[1]. The sources here say nothing more about install commands.

Tailwind CSS IntelliSense. For the extension to activate, tailwindcss must be installed ^[2]. Emmet-style completions are off by default ^[2]. Activation notes for v4 and later and for v3 and earlier are in the table above.

NormWind. Install it from npm as a dev dependency, or run it with npx ^[3]. It works with Tailwind CSS v4 projects, and its CI runs on Ubuntu, Windows and macOS ^[3]. Day to day, the audit exits 1 when it finds anything, so it can fail a CI job ^[3].

Things to check before you choose

Ask which Tailwind version your project uses. The plugin's page names Tailwind CSS v3.0+ ^[1]. NormWind's claims name v4 projects ^[3].

Check your editor. IntelliSense's page speaks of Visual Studio Code users ^[2].

Check whether you want the check to run in CI, and whether you need it to touch only changed lines. NormWind's claims describe that ^[3].

Check whether the sources for a tool say it rewrites your code, and whether you can preview it. NormWind's claims describe a dry run ^[3].

Check prices on each tool's own page, since the facts here give none for prettier-plugin-tailwindcss or Tailwind CSS IntelliSense.

How to choose

If you want classes sorted automatically in Prettier, the plugin's page describes that ^[1].

If you want sorting in extra attributes or tagged template literals, the plugin's page lists both ^[1] ^[1].

If you want autocomplete and linting in Visual Studio Code, with a default set of class attributes for them, IntelliSense's page describes them ^[2] ^[2].

If you want to find shorthand pairs and arbitrary values that match a named utility, NormWind's claims describe that ^[3] ^[3].

If you want findings as pull request annotations or SARIF output, NormWind's claims describe both ^[3] ^[3].

If you want a free tool under the MIT licence, NormWind's claims say that ^[3] ^[3].

Frequently asked questions

Is prettier-plugin-tailwindcss free?

The facts given here state no price for prettier-plugin-tailwindcss, so its price is not published here. Its page describes it as a Prettier v3+ plugin that sorts Tailwind classes automatically ^[1]. Check the plugin's own page for current terms before you decide, since a missing price in these sources is not the same as a stated free price.

Is Tailwind CSS IntelliSense free?

The facts here give no price for Tailwind CSS IntelliSense, so its price is not published here. Its page says it gives Visual Studio Code users autocomplete, syntax highlighting and linting ^[2]. Check the extension's own listing for current terms. NormWind, by comparison, is free with no paid tier ^[3].

Do prettier-plugin-tailwindcss and Tailwind CSS IntelliSense work with the newest Tailwind CSS?

The plugin's page names Tailwind CSS v3.0+ ^[1]. Check each tool's own page for its current version notes before you install, since these may change. NormWind's claims say it works with Tailwind CSS v4 projects ^[3].

What does Tailwind CSS IntelliSense need to activate?

Its page says tailwindcss must be installed for the extension to activate ^[2]. The table above lists its activation notes by version.

How do you install NormWind and run it in CI?

Install NormWind from npm as a dev dependency, or run it with npx ^[3]. It ships as a GitHub Action that annotates pull requests inline ^[3]. The audit exits 1 when it finds anything, so it can fail a CI job ^[3]. A baseline records current finding counts so only new findings fail the check ^[3].

NormWind is free with no paid tier. ^[3]

Try NormWind