What problem does it solve? Frontend code written by developers or AI agents often misses the small visual details — wrong easing curves, mismatched border radii, undersized hit areas, missing reduced-motion handling — that separate polished interfaces from generic ones. This Skill provides a structured rule set and audit methodology to catch and fix those details. ## Core Features & Use Cases - Polish Rule Tables: Concrete rules for concentric border radius, optical alignment, shadow-vs-border usage, motion easing, typography smoothing, tabular numbers, icon stroke weight, and minimum hit areas. - Design Audit Suite: Grep-based mechanical detection patterns (in references/design-audit.md) for motion gaps, accessibility violations, layout-property animation, and duration/easing consistency across a whole codebase. - Motion Principles Reference: Platform-neutral guidance on emotional intent, stagger budgets, motion archetypes, and Disney-adapted animation ranges (in references/motion-principles.md). - Use Case: When reviewing a React frontend pull request, use this Skill to verify enter animations use ease-out, every animation has a prefers-reduced-motion branch, hit areas meet 44x44px, and icons use currentColor rather than separate state assets. ## Quick Start Review this UI component against the UI polish rules and report any HIGH or MEDIUM findings on motion, typography, and hit areas.
