SayDeploy Plain comparisons of developer tools, AI coding tools included

eslint-plugin-tailwindcss vs tailwind-merge in 2026

What eslint-plugin-tailwindcss and tailwind-merge each do for Tailwind classes, what they cost, how to set them up, and where NormWind fits.

By SayDeploy ยท

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

For Tailwind classes, tailwind-merge is a utility function that merges Tailwind CSS classes in JS without style conflicts [1], and eslint-plugin-tailwindcss is an ESLint plugin for Tailwind CSS usage [2]. So one checks your class usage as you lint, and the other merges classes in your code. NormWind finds class pairs that can be written as one shorthand [3] and flags arbitrary values that match a named Tailwind utility [3]. eslint-plugin-tailwindcss is free [2], and NormWind is free with no paid tier [3].

OptionWhat it doesPriceInstallTailwind version
eslint-plugin-tailwindcssESLint plugin for Tailwind CSS usage [2]Free [2]npm i -D eslint-plugin-tailwindcss [2]Made for Tailwind CSS v4 [2]
tailwind-mergeMerges Tailwind CSS classes in JS without style conflicts [1]not publishednot publishedTailwind v4.0 up to v4.3 [1]
NormWindFinds shorthand pairs and flags arbitrary values matching named utilities [3] [3]Free, no paid tier [3]npm dev dependency or npx [3]Tailwind CSS v4 projects [3]

The short answer

eslint-plugin-tailwindcss checks how your code uses Tailwind CSS while ESLint lints it [2]. tailwind-merge is a function you call in your JS to merge Tailwind CSS classes without style conflicts [1]. NormWind finds Tailwind class pairs like px-4 py-4 that can be written as one shorthand like p-4 [3].

On needs, the eslint-plugin-tailwindcss page says it is made for Tailwind CSS v4 [2], offers 9 rules [2] and can run linting inside a hosted repository's pipeline [2]. The tailwind-merge page covers merging classes without style conflicts [1] and running in all modern browsers and maintained Node versions [1]. NormWind's sources cover flagging arbitrary values that match a named utility [3] and annotating pull requests inline as a GitHub Action [3].

What eslint-plugin-tailwindcss, tailwind-merge is built for

The eslint-plugin-tailwindcss page calls it an ESLint plugin for Tailwind CSS usage [2]. It says the project is made for Tailwind CSS v4 [2] and that 9 rules are available, with more on the way [2]. It supports ESLint v10 [2]. For Tailwind CSS v3 or older ESLint versions, the page points to [email protected] [2]. It can run the linting process inside a pipeline of your hosted repository [2].

The tailwind-merge page describes it as a utility function to efficiently merge Tailwind CSS classes in JS without style conflicts [1]. It states support for Tailwind v4.0 up to v4.3 [1]. It works in all modern browsers and maintained Node versions [1]. It has published declarations compatible with TypeScript 3.8 and newer [1].

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 canonicalizeCandidates engine [3]. Before merging classes, it compares the generated CSS before and after, and skips the merge if they differ [3].

The --fix option rewrites findings in Vue, Svelte, Astro and HTML files, and --fixall also covers JS/TS/JSX/TSX files [3]. The --dry-run option shows which files a fix would change without writing to disk [3].

For reviews and CI, it prints output as text, JSON or SARIF 2.1.0 for GitHub code scanning [3], and ships as a GitHub Action that annotates pull requests inline [3]. The --diff-base option reports only findings on lines changed since a git ref such as origin/main [3]. The --baseline option records current per-file finding counts so only new findings fail CI [3].

Pricing and fees

The eslint-plugin-tailwindcss page says it is available to everyone for free [2]. No paid plan is mentioned in its sources here.

The tailwind-merge sources given here do not state a price, so its price is not published here. Check its own pages for licence and cost.

NormWind is free with no paid tier [3]. It is released under the MIT licence [3].

None of the three needs a payment service, according to the sources here, and no fees on top of another service are stated for any of them.

Setting it up and daily use

eslint-plugin-tailwindcss installs as a development dependency with npm i -D eslint-plugin-tailwindcss [2]. It can also be installed with other package managers such as pnpm [2]. As a dev dependency, it does not affect your final bundle size [2]. Its setup needs a mandatory cssConfigPath setting [2], which can be an absolute or relative path [2].

The tailwind-merge sources here do not describe installation steps. Daily, it is a function you call in your JS to merge classes [1].

NormWind installs from npm as a dev dependency, or runs with npx [3]. It works with Tailwind CSS v4 projects, and CI runs on Ubuntu, Windows and macOS [3]. The audit exits 1 when it finds anything, so it can fail a CI job [3]. Before applying fixes, --dry-run lists the files that would change [3].

Things to check before you choose

Ask what job you need done: checking class usage while you lint, merging classes at runtime in your code, or cleaning up classes in your source files. Each tool's sources describe a different one of these.

Check your Tailwind version. tailwind-merge states support for Tailwind v4.0 up to v4.3 [1], and eslint-plugin-tailwindcss points v3 users to its 3.x.x line [2].

Check your existing tooling. eslint-plugin-tailwindcss is an ESLint plugin [2] and needs a cssConfigPath setting [2].

Check which file types a tool rewrites, and whether you can preview changes first.

Check how a tool reports in pull requests and CI, and whether it can ignore old findings.

Check licence and price on each project's own pages where the facts here are silent.

How to choose

If you want lint rules for Tailwind CSS usage inside ESLint, the eslint-plugin-tailwindcss page describes that [2].

If you need to merge Tailwind CSS classes in JS without style conflicts, the tailwind-merge page describes that [1].

If you need TypeScript declarations, tailwind-merge publishes ones compatible with TypeScript 3.8 and newer [1].

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

If you want pull request annotations [3] with only changed lines reported [3], NormWind's claims describe that.

If you want linting in your hosted repository's pipeline, eslint-plugin-tailwindcss says it can do that [2].

Frequently asked questions

Is eslint-plugin-tailwindcss free?

The eslint-plugin-tailwindcss page says it is available to everyone for free [2]. It installs as a development dependency, so it does not affect your final bundle size [2]. The sources here do not mention any paid plan, so check the project's own pages if you need detail on licence terms.

Which Tailwind versions does tailwind-merge support?

The tailwind-merge page states that it supports Tailwind v4.0 up to v4.3 [1]. It also says it works in all modern browsers and maintained Node versions [1]. If your project uses a later Tailwind release, check its own pages for current support before upgrading.

Can eslint-plugin-tailwindcss run in CI?

Its page says it can run the linting process inside a pipeline of your hosted repository [2]. Setup needs a mandatory cssConfigPath setting [2], which can be an absolute or relative path [2]. Check its documentation for the exact pipeline steps your host needs.

Is NormWind free and open source?

NormWind is free with no paid tier [3]. It is released under the MIT licence [3]. It installs from npm as a dev dependency, or you can run it with npx [3]. The sources here give no other price, so the only cost they state is free.

How does NormWind avoid breaking styles when it fixes classes?

Before merging classes, NormWind compares the generated CSS before and after, and skips the merge if they differ [3]. The --dry-run option shows which files a fix would change without writing to disk [3]. That lets a developer review the scope of a fix before any file is rewritten.

NormWind is free with no paid tier. [3]

Try NormWind

Sources

  1. tailwind-merge, github.com/dcastil/tailwind-merge, read 2026-10-07
  2. eslint-plugin-tailwindcss, github.com/francoismassart/eslint-plugin-tailwindcss, read 2026-10-07
  3. NormWind's own description of itself (the product of this site's publisher)

Related comparisons