What problem does it solve? Frontend codebases accumulate design debt: hardcoded hex colors that break dark mode, arbitrary Tailwind values outside the spacing scale, and one-off components that duplicate the design system. This Skill audits your code against the project's own tokens and class conventions to find and report that drift. ## Core Features & Use Cases - Design-Token Drift Detection: Scans TSX/JSX files for hardcoded hex colors, arbitrary Tailwind values, and inline styles that bypass semantic tokens. - Multi-Dimension Audit: Reviews color palette, typography, spacing, component patterns, accessibility, responsive design, animation, and dark mode with weighted scoring. - Report Templates: Ships a full audit report template and a 30-minute quick-audit checklist for structured, prioritized findings. - Use Case: Before shipping a new feature, ask for a design consistency audit of the changed app to catch hardcoded colors, missing ARIA labels, and non-semantic HTML before review. ## Quick Start Ask the assistant to audit a specific app or component for design consistency, for example by requesting a check of color palette usage and hardcoded colors in your frontend app.
