What problem does it solve?
It helps teams identify and document accessibility, performance, theming, and responsive design problems in a frontend so they can be fixed later with clear guidance.
Core Features & Use Cases
- Accessibility (A11y) scanning: Contrast checks, missing ARIA, keyboard navigation problems, semantic HTML issues, alt text gaps, and form labeling/error-message defects.
- Performance review: Detects layout thrashing, expensive animations, missing asset optimizations, bundle bloat risks, and re-render inefficiencies.
- Theming and dark-mode validation: Flags hard-coded colors, broken dark mode variants, inconsistent design tokens, and theme switching failures.
- Responsive design checks: Finds fixed-width breakages, inadequate touch targets, horizontal overflow, text-scaling issues, and missing breakpoints.
- Anti-pattern detection: Compares findings against the frontend-design skill’s “DON’T” guidance and looks for common AI-slop visual tells.
Quick Start
Run an audit for the most important page or component by calling the audit skill for the specified area.