KBAISE/ for lovable
Directory

Motion (was Framer Motion)

Declarative React animation

FreeAnimation & motionmotion.dev

What it is

Renamed from Framer Motion and spun out as an independent MIT project at motion.dev. Declarative animation via props, AnimatePresence for exits, layout/layoutId for shared-element transitions, variants for staggering, useScroll for scroll-linked values.

Why it earns a slot

Page and route transitions between article and index, staggered card reveals on the issue grid, image-to-lightbox shared-element morphs. Composes cleanly with Tailwind and shadcn. Use LazyMotion + the m component to land near 18 kB instead of 38 kB.

Know before you commit

Do not build long scroll narratives with useScroll — once you need pinning and scrubbing you are rebuilding ScrollTrigger badly. Do not wrap hundreds of list items in motion.div.

Getting started

npm install motion

Field notes

0 from the community

Sign in to add a field note. Reading is always open.

Loading notes…

Also in Animation & motion

Timeline animation engine

FreeAnimation & motion
Free — all plugins, since 2025
Open dossier
Lenis
lenis.dev

Smooth-scroll library

FreeAnimation & motion
Free · MIT
Open dossier
React Three Fiber
r3f.docs.pmnd.rs

React renderer for Three.js

FreeAnimation & motion
Free · MIT
Open dossier
Rive
rive.app

Interactive vector animation

PaidAnimation & motion
Runtimes free MIT · publishing $9/seat/mo
Open dossier