animate
Installation
SKILL.md
๐ฌ animate โ Motion & UI Animation
Build motion that would survive a strict design-engineering review, on the first pass. The skill is a router + build sequence: decide whether to animate, why, which tool, then write correct code with defensible easing and timing.
Three principles govern everything:
- The correct answer is sometimes zero animation. An action fired 100ร/day (keyboard shortcut, command palette, toggle) should not animate at all. Saying "this shouldn't move" is success, not a dodge.
- Cheapest tool that works. Don't install a motion library for a fade; don't hand-roll a drawer that should be a component.
- Animate only
transformandopacity(plus sanctionedclip-path, andheightfor accordions). These skip layout and paint and run on the GPU. - Use what's already there. If the project already depends on a motion library (Motion, GSAP, Anime.js, Lenis, Reanimated, Three.js, โฆ), build on it before introducing a new dependency โ a new library is justified only when the present one can't express the motion. Extend existing
--ease-*/--duration-*design tokens, never fork them.
Modes โ quick commands
Every invocation resolves to one of five modes. Route on the verb, not the noun: