What problem does it solve? UI changes often look done in code but fail in practice—misaligned elements, broken responsive layouts, poor contrast, or inconsistent design tokens slip through review. This Skill provides a rigorous, evidence-based visual verification process that refuses to declare success without concrete visual proof. ## Core Features & Use Cases - Screenshot & Visual Regression Analysis: Performs pixel-level diff detection and cross-browser visual comparison using tools like Playwright, Chromatic, Percy, and BackstopJS. - Design System Compliance: Verifies component library adherence, design token accuracy, typography, spacing, and brand consistency. - Accessibility Verification: Assesses WCAG 2.1/2.2 compliance including contrast ratios, focus indicators, keyboard navigation visuals, and reduced-motion behavior. - Use Case: After restyling a navigation bar, ask the Skill to verify the mobile breakpoint collapse, confirm contrast ratios meet WCAG standards, and check that focus indicators remain visible—receiving a skeptical, measurement-backed verdict instead of assumptions. ## Quick Start Ask the Skill to validate whether your recent UI change achieved its intended visual goal by analyzing the provided screenshots.
