oxlint-tailwindcss

Tailwind CSS v4 linting rules for oxlint — fast, deterministic, with typo suggestions and autofixes.

Documentation · Documentación (ES) · Rules · Changelog

27 lint rules that catch invalid classes, conflicts, and deprecated utilities, and keep your class strings canonical and sorted — reading your real Tailwind v4 design system (@theme tokens, shadcn variables, typography plugin) for exact, machine-independent results.

// oxlint-tailwindcss flags this:

//                   ^^^^^^^^^^^ "itms-center" → did you mean "items-center"?  (no-unknown-classes)
//                               ^^^^^^^^^^ "bg-blu-500" → did you mean "bg-blue-500"?
//                  text-red-500 / text-blue-500 both set "color"             (no-conflicting-classes)
//                                                              ^^^^^^^^^ "flex-grow" is deprecated in v4 → "grow"  (no-deprecated-classes)

// ...and autofixes this:
   →   
//   (enforce-sort-order — identical output to oxfmt and prettier-plugin-tailwindcss)

Why

• Configure once, never fails — declare your CSS entry point and every rule reads the same design system. Same input → same output on every machine and CI.
• Built for Tailwind v4 — reads your @theme { … } tokens, shadcn variables, and @plugin/@import plugins (@tailwindcss/typography, tailwindcss-animate, tw-animate-css).
• Coexists with oxfmt & Prettier — point every tool at the same CSS and list your class helpers in the formatter, and they sort the same way. Interop guide ↗
• Monorepo-ready — one root config with a glob → CSS mapping, or one .oxlintrc.json per package. Both fully deterministic.
• Fail loud — misconfiguration surfaces as a single designSystemUnavailable diagnostic with an actionable hint, never silently skipped rules, and a misspelt setting is named with the one you meant.
• Lightweight & fast — native oxlint plugin with content-hash disk caching; only two runtime dependencies (@tailwindcss/node, tailwindcss).

Quick start

pnpm add -D oxlint-tailwindcss

Add the plugin and your Tailwind entry point to .oxlintrc.json:

{
  "jsPlugins": ["oxlint-tailwindcss"],
  "settings": {
    "tailwindcss": {
      "entryPoint": "src/styles.css", // your CSS file with @import "tailwindcss"
    },
  },
  "rules": {
    "tailwindcss/no-unknown-classes": "error",
    "tailwindcss/no-conflicting-classes": "error",
    "tailwindcss/enforce-sort-order": "warn",
  },
}

Then run oxlint. See the Setup guide for the recommended full rule set, monorepo patterns, and all settings.tailwindcss options.

Upgrading from v0.x? settings.tailwindcss.entryPoint is now required — see the migration guide.

Rules

27 rules across four categories. Every rule has a dedicated docs page (EN/ES) with examples and options.

Correctness — no-conflicting-classes · no-contradicting-variants · no-dark-without-light · no-duplicate-classes · no-dynamic-classes · no-unknown-classes