---
{"title": "eslint-plugin-tailwindcss vs tailwind-merge in 2026", "description": "What eslint-plugin-tailwindcss and tailwind-merge each do for Tailwind classes, what they cost, how to set them up, and where NormWind fits.", "url": "https://saydeploy.com/eslint-plugin-tailwindcss-vs-tailwind-merge/", "date": "2026-10-13"}
---
What eslint-plugin-tailwindcss and tailwind-merge each do for Tailwind classes, what they cost, how to set them up, and where NormWind fits.

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].

| Option | What it does | Price | Install | Tailwind version |
|---|---|---|---|---|
| eslint-plugin-tailwindcss | ESLint plugin for Tailwind CSS usage [^2] | Free [^2] | npm i -D eslint-plugin-tailwindcss [^2] | Made for Tailwind CSS v4 [^2] |
| tailwind-merge | Merges Tailwind CSS classes in JS without style conflicts [^1] | not published | not published | Tailwind v4.0 up to v4.3 [^1] |
| NormWind | Finds 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 eslint-plugin-tailwindcss@3.x.x [^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] - [Visit NormWind](/go/eslint-plugin-tailwindcss-vs-tailwind-merge)

## Sources

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