Better UI Polish

•
8.8k
•

Polishes user interfaces with exact values for border radii, shadows, optical alignments, icon states, and motion physics.

Better UI Polish provides fine-grained, mathematically sound visual rules to elevate interfaces from functional to world-class. It guides Claude in auditing and correcting visual design details, such as calculating nested border radii (outer radius = inner radius + padding), swapping borders for multi-layer depth shadows, dialing in interactive motion curves (like active button scaling to 0.96 over 150ms), and enforcing accessibility requirements like prefers-reduced-motion. This skill ensures your application displays consistent elevation, seamless theme transitions, and optically balanced icon treatments without disrupting existing design tokens or component libraries.

주요 기능

01Enforces accessibility motion gates like prefers-reduced-motion fallbacks
02Applies exact mathematical rules for nested border radius and concentric padding
038,811 GitHub stars
04Configures precise motion physics, transition timing, and interactive micro-interactions
05Replaces structural border hacks with accessible, layered box-shadow elevation
06Audits stroke weight, color tokens, and SVG state mappings for consistent iconography

사용 사례

01Fixing optical misalignments and nested radius distortions in complex modern dashboards
02Refining component libraries with fluid interactive states, exit animations, and theme-switch protection
03Conducting automated UI code reviews to detect anti-patterns like transition-all or stuck touch states