shadcn · SHAD0002

Use design-system color tokens

Prefer theme colors over raw color values.

SHAD0002vite-doctor/shadcnuiwarnSuggestion

shadcn/no-raw-colorssrc/rule-packs/shadcn/rules/index.ts Upstream docs

Run this rule

pnpm vite-doctor . --extends shadcn/strict --rules shadcn/no-raw-colors

Raw palette colors and literal SVG colors bypass the project's theme. Checking undeclared color tokens and suggesting theme replacements requires a readable theme; without one, those checks are unavailable.

Recommended fix

Use a color token declared by the theme. For SVG, use currentColor with a theme color class or reference a theme variable.

Useful links

Rule reference

Example

Inherit the SVG color without theme lookup

Before

<svg><path fill="#ec4899" d="M0 0h10v10H0z" /></svg>

After