shadcn · UI

SHAD0001Avoid restyling design-system components

Keep component-owned visual styles inside the component contract.

Why it happens

Appearance classes at a component call site can override the variants and sizes owned by the design system. The Rule checks recognized components against the configured class policy.

Fix

Use the component's variants or sizes. Allow layout classes explicitly when the project's component policy permits them.

Example

Use a component variant for appearance

Before

import { Button } from "@/components/ui/button"

<Button className="bg-pink-500">Delete account</Button>

After

import { Button } from "@/components/ui/button"

<Button variant="destructive">Delete account</Button>

Verify the fix

Run only this rule after editing so the report stays focused on the diagnostic you are closing:

pnpm vite-doctor . --extends shadcn/strict --rules shadcn/no-restyle
Copyright © 2026