design-with-taste — Claude Code skill: UI design rules

What design-with-taste does

The skill encodes three principles the agent applies to any interface: simplicity through gradual revelation, fluidity of transitions, and delight through selective emphasis. Order matters — no delight without fluidity, no fluidity without simplicity. The rules are concrete rather than aspirational: one primary action per view, layered trays instead of long forms, visibly different heights for stacked layers, and a title plus dismiss action on every sheet.

Animation gets its own set of rules. Nothing appears or disappears instantly, shared elements travel between states instead of remounting, and content enters from the direction the user navigated. Entrances and morphs use cubic-bezier(0.16, 1, 0.3, 1), exits use ease-in. For changing button labels the skill points to torph (npm i torph), with crossfade as the fallback.

This one is meant to sit alongside frontend-design, web-animation-design and similar skills rather than replace them. Install it before the agent writes its first component — the rules apply to every UI generation, so retrofitting them later means redoing the work.