Audit Design System

Review adherence to the design system.

When to Use

• After major UI changes
• Checking token usage
• Ensuring theming consistency

Approach

Step 1: Project Invariants (Required)

Before auditing, check docs/knowledge-base/ for project-specific constraints:

• SPEC-CSS.md — token definitions and mandates
• SPEC-SPACING.md — spacing system
• RULES-UI.md — component and styling rules
• Flag any violation of documented invariants as Critical priority.

Step 2: Focus Areas

• Color Tokens: Correct use of var(--color-*) tokens
• Component Usage: Using existing components, not one-offs
• Theming: Light/dark mode support
• Semantic Tokens: Using semantic tokens over primitive

Checklist

• All colors use semantic tokens
• No inline styles with hardcoded values
• Existing components reused where possible
• Light and dark mode verified
• Custom properties follow naming convention

Output

Findings report with specific file:line citations and token references.