Принципы полировки UI-компонентов

★ 8.2 · content

better-ui is a Claude Code skill that provides design engineering principles for making interfaces feel polished and considered. It covers 13 concrete principles with exact values: concentric border radius (outer = inner + padding), optical over geometric alignment, layered box-shadows for depth, interruptible CSS transitions, stagger entrances at ~100 ms intervals, scale(0.96) on press, icon cross-fading via opacity/scale/blur (0.25→1, 4px→0px), and transition suppression during theme switches. The skill organises guidance across surfaces, enter/exit animations, icon transitions, micro-interactions, and performance, with linked recipe files for CSS, Tailwind, and Framer Motion. Use it when building or reviewing UI components, hover states, shadows, or any visual detail where the interface feels subtly off.