@blankui/eslint-plugin catches what types cannot. Every message says what to use instead, because agents act on the exact text of lint errors. npx blankui init sets it up.
// eslint.config.js
import tseslint from "typescript-eslint"
import blankui from "@blankui/eslint-plugin"
export default tseslint.config(...tseslint.configs.recommended, ...blankui.configs.recommended)
The recommended config checks .jsx and .tsx files and skips components/ui.
Reports Tailwind palette colors like bg-blue-500 and text-white. They render nothing in BlankUI. Use a semantic token such as bg-primary or text-foreground.
Reports arbitrary values like mt-[13px], w-[372px] and bg-[#fff]. Use a step from the scale or a token. Arbitrary variants like data-[state=open]: are fine.
Reports colors in style={{ ... }}. Use a token class.
Reports raw <button>, <input>, <select>, <textarea> and <table>, and names the BlankUI component to use.
Reports flex flex-col gap-4, space-y-6, flex gap-2 and grid grid-cols-3 gap-6 on plain elements, and suggests Stack, Inline or Grid.
Reports imports from radix-ui, @radix-ui/* and sonner in app code. Import the BlankUI component instead.
Reports a Card inside another Card.