Design System Enforcer

Use this skill to keep UI consistent by enforcing the repo’s design system, components, and tokens (web + mobile).

This skill is strongest when it acts like a “diff gate”:

• New UI should use existing components.
• New styles should use tokens/theme helpers, not ad hoc values.
• New patterns should match existing interaction/empty/error/loading conventions.

Workflow

1. Locate the design system.

• Identify shared UI packages, component folders, or token files (often under packages/).
• Look for styling infrastructure:
  • tailwind.config.*, postcss.config.*
  • theme files (theme.ts, tokens.ts, colors.ts, etc.)
  • CSS variables / token maps
• Look for docs under docs/ or packages/ that describe UI standards.