svg-animation-motion-expert
Installation
SKILL.md
SVG & Web Animation Motion Expert
English
Description
A dedicated skill for crafting fluid, high-performance web animations and micro-interactions. Covers direct SVG manipulation (paths, masks, clip-paths), React-based animations using Framer Motion 12+, advanced timeline choreography with GSAP 3, native CSS Scroll-Driven Animations, and the View Transitions API for seamless page navigations.
Trigger Conditions
- When building complex landing page animations or scroll reveals.
- When creating interactive SVG graphics, charts, or diagrams.
- When the user asks for "buttery smooth", "apple-like", or "dynamic" interactions.
- When implementing page transitions using the native View Transitions API.