Best Animation & motion skills for AI coding (2026)
image-to-video is the best animation & motion skill for AI coding — 1 GitHub stars, 134k installs. Strong alternatives: optimize and css-animations.
Curated web animation, motion and micro-interaction skills for builders, ranked by real adoption (installs, then GitHub stars). Part of Frontend & Design — see the full best design skills shortlist.
Curated by Skillselion · ranked by adoption from the skills.sh registry & GitHub.
The top 12 animation & motion skills
| # | Skill | Author | Repo | For | Stars | Installs |
|---|---|---|---|---|---|---|
| 1 |  image-to-videostill-to-motion-animation | runcomfy-com | runcomfy-com/skills | Claude Code | 1 | 134k |
| 2 |  optimizeDiagnose and fix laggy UI—Core Web Vitals, bundles, images, animations, and runtime jank—with measure-before/after discipline. | pbakaus | pbakaus/impeccable | Claude Code | 36k | 81.9k |
| 3 |  css-animationsAuthor CSS keyframe motion that HyperFrames can seek deterministically in preview and final render. | heygen-com | heygen-com/hyperframes | Claude Code | 25.6k | 72.4k |
| 4 | animejs Wire Anime.js animations into HeyGen HyperFrames so every frame is seek-driven, autoplay-off, and registered on `window.__hfAnime` for deterministic video renders. | heygen-com | heygen-com/hyperframes | Claude Code | 25.6k | 70.1k |
| 5 | three Build deterministic Three.js/WebGL layers in HyperFrames that render on `hf-seek` using `window.__hfThreeTime`, not requestAnimationFrame. | heygen-com | heygen-com/hyperframes | Claude Code | 25.6k | 69.4k |
| 6 | waapi Author native `element.animate()` motion that HyperFrames can scrub via `document.getAnimations()` and `currentTime` without GSAP. | heygen-com | heygen-com/hyperframes | Claude Code | 25.6k | 68.7k |
| 7 |  vercel-react-view-transitionsShip native-feeling route and layout animations in React and Next.js using the View Transition API without ad-hoc CSS hacks. | vercel-labs | vercel-labs/agent-skills | Claude Code | 27.7k | 57.1k |
| 8 |  building-native-uiImplement performant Expo/React Native UI motion with Reanimated v4 entering, exiting, layout, and scroll-linked animations. | expo | expo/skills | Claude Code | 2k | 51.4k |
| 9 |  make-interfaces-feel-betterApply interruptible motion, split-and-stagger enter transitions, and contextual icon animation rules so interactive UI feels responsive instead of janky. | jakubkrehel | jakubkrehel/make-interfaces-feel-better | Claude Code | 953 | 29.7k |
| 10 |  gsap-scrolltriggerImplement scroll-linked animations, pinning, scrub, and parallax with official GSAP ScrollTrigger patterns when building marketing sites or app UIs. | greensock | greensock/gsap-skills | Claude Code | 8.5k | 23k |
| 11 | gsap-timeline Sequence and choreograph multi-step GSAP animations with timelines, labels, and position parameters instead of loose chained tweens. | greensock | greensock/gsap-skills | Claude Code | 8.5k | 22.1k |
| 12 | gsap-plugins Register and apply GSAP plugins (ScrollTo, Flip, Draggable, SVG, text, easing, GSDevTools) correctly in web animation code without outdated Club licensing steps. | greensock | greensock/gsap-skills | Claude Code | 8.5k | 21.7k |
Common questions
What is the best skill for animation & motion?
image-to-video is the top-ranked animation & motion skill, with 134k installs and 1 GitHub stars — still-to-motion-animation.
How are these animation & motion skills ranked?
By real adoption — installs first, then GitHub stars — across curated skills matching web animation, motion and micro-interaction skills. Data from the skills.sh registry and GitHub.
How do I install image-to-video?
Run: npx skills add https://github.com/runcomfy-com/skills --skill image-to-video