Comparing
Production-ready animations and gestures for React — declarative, physics-based, with layout animations and exit transitions.
The professional-grade JavaScript animation library — animate anything (DOM, CSS, SVG, Canvas, WebGL) with a timeline-based API.
| Metric | framer-motion | gsap |
|---|---|---|
| Ecosystem | npm | npm |
| Difficulty | Intermediate | Intermediate |
| Weekly downloads | 7.0M↑ | 2.0M |
| Latest version | v12.6.2 | v3.12.7 |
| Recipes | 2 | 2 |
framer-motion only
Shared
gsap only
React apps needing UI animations: page transitions, list reordering, drag-and-drop, hover effects, scroll-triggered reveals, and exit animations.
Marketing landing pages, scroll-driven storytelling, complex animation sequences, SVG/logo animations, parallax effects, or any animation that needs to be framework-agnostic.
Non-React projects, performance-critical animations running at 120fps with many particles (use CSS or WebGL), or very simple opacity/transform transitions where CSS is sufficient.
Simple React UI micro-interactions where framer-motion or CSS is simpler. GSAP's free tier doesn't include ScrollSmoother and some plugins commercially.
framer-motion
gsap