What you can do with Lint

3 use cases

• Block arbitrary Tailwind values in agent-written UI

  Flag off-scale Tailwind values so agents use your theme's spacing, colors, and sizes instead.

  • Lint
  • Software and DevOps
  • Intermediate
  View prompt

  Use the GitHub repo shadcn-ui/lint to set up the no-arbitrary-values rule in <project-path>. Follow the README ESLint setup for React, then run the lint command. Expected output: a list of arbitrary Tailwind values in the project, or zero errors. Verify that the rule reports a test class such as p-[13px] in one component file.

  Share Save

• Lock component styling with per-component contracts

  Let pages change some styles on a component while keeping its size, shape, and font fixed.

  • Lint
  • Software and DevOps
  • Advanced
  View prompt

  Use the GitHub repo shadcn-ui/lint to add a no-restyle contract for <component-name> in <project-path>. Write the contract in the ESLint config, then run the lint command. Expected output: the contract allows the listed classes and reports the others. Verify that one disallowed class on <component-name> produces the custom message from the config.

  Share Save

• Make coding agents fix Lint errors before finishing

  Give the agent a Lint command and an instruction to run it and fix errors after every change.

  • Lint
  • Software and DevOps
  • Intermediate
  View prompt

  Use the GitHub repo shadcn-ui/lint to set up the lint loop in <project-path>. Install the package, add the lint script, and add the README instruction to AGENTS.md. Expected output: npm run lint exits cleanly on the current code. Verify that a deliberate arbitrary value in one file makes the command report an error.

  Share Save

How to use Lint

1. Check you have what it needs: Node.js 20.19 or later; A Tailwind v4 project (shadcn/ui is not required); ESLint 9.30 or later, or Oxlint 1.80 or later.
2. Open shadcn-ui/lint on GitHub and read the README and license.
3. Run npm install -D @shadcn/lint eslint @typescript-eslint/parser in the project.
4. Create eslint.config.mjs with the shadcn plugin and the rule "shadcn/no-arbitrary-values": "error", as shown in the React ESLint setup.
5. Run npx eslint . and confirm it reports any existing arbitrary values.
6. Fix the reported files or add the Lint command to package.json as the Lint script.

These steps come from our top use case, Block arbitrary Tailwind values in agent-written UI, which also has a copy-paste agent prompt.

Lint alternatives · Best AI repos for Software and DevOps

About this repo

• Who it is forFront-end developers and teams using coding agents to write React, Vue, or Svelte UI on a Tailwind v4 project.
• Why it is hot
• LanguageTypeScript
• Sourcegithub.com/shadcn-ui/lint · Back to Hot repos

Requirements

• Node.js 20.19 or later
• A Tailwind v4 project (shadcn/ui is not required)
• ESLint 9.30 or later, or Oxlint 1.80 or later
• A React, Vue, or Svelte project

Related repos

• #1 this week Harness2 Harness² is a Python framework from Google Research that refines the harness around a fixed model (prompts, tools, memory, skills, orchestration) so it performs better on agent tasks.
• #8 this week iFixAi iFixAi is an open-source Python tool that audits whether an AI agent is doing the job it is supposed to do, using 60 inspections that combine red-teaming with operational checks.
• #9 this week Orca Orca is a desktop app, with a mobile companion, for running several CLI coding agents side by side, each in its own git worktree, and tracking them in one place.