What problem does it solve? Uncontrolled visual rewrites can silently break layout, contrast, focus states, and emergency-critical UI. This Skill enforces a repeatable loop of baseline capture, controlled change, rendering, comparison, and repair so every visual iteration is intentional, measurable, and reversible. ## Core Features & Use Cases - Baseline Management: Capture representative states across routes, viewports (360px mobile through desktop), appearance modes, and accessibility settings before making changes. - Regression Comparison: Systematically check layout geometry, spacing, typography, contrast, translucency, z-index layering, safe-area behavior, and animation states against the baseline. - Accessibility & Emergency Gates: Verify focus-visible, keyboard order, target size, reduced motion, high contrast, and that emergency CTAs remain solid, readable, and instantly actionable. - Use Case: When restyling a health app's dashboard with glassmorphism effects, use this Skill to capture baselines first, apply one material change at a time, and confirm no per-row blur or contrast regression was introduced. ## Quick Start Use the visual regression skill to establish baselines for the dashboard and habits screens, then verify my Liquid Glass navigation change against them.
