design-motion-principleslisted

# design-motion-principles > Catalogue stub — full skill: [kylezantos/design-motion-principles](https://github.com/kylezantos/design-motion-principles) > Type: package — install via `npx skills add` (SKILL.md alone is not sufficient; requires workflow files) ## When to use Activate when the user wants to: - Build interactive components with motion (transitions, hover states, micro-interactions, enter/exit animations) - Audit existing UI motion for AI-slop patterns (pulsing indicators, hover-scale-on-everything, stagger-spam) - Get motion guidance weighted across Emil Kowalski, Jakub Krehel, and Jhey Tompkins lenses Do **not** activate for static layout, color, or typography work — route to a design-systems skill instead. ## How to install ```bash npx skills add kylezantos/design-motion-principles ``` Works with Claude Code, Cursor, Windsurf, and other AI coding assistants. ## How to invoke after install The skill detects mode from your request: | You say | Mode | |---------|------| | "animate this", "add motion", "make it feel alive" | **Create** | | "audit my animations", "review motion", "check for AI slop" | **Audit** | | Ambiguous | Skill asks which mode | Invoke the `design-motion-principles` skill and state your request. ## What it does Two modes, three lenses weighted to project context: | Mode | Output | |------|--------| | **Create** | Context discovery → lens weighting → component with motion baked in (React / Framer Motion / CSS / HTML) | | **Audit*