Motion
La librería de animación más usada en React, antes Framer Motion.
¿Es para ti?
Úsalo si…
- Usas React y quieres animaciones fluidas.
- Necesitas animar entradas, salidas y gestos.
- Prefieres animar con props en lugar de con código.
Mejor evítalo si…
- Buscas animaciones complejas con líneas de tiempo largas.
- Solo necesitas un par de transiciones de CSS.
Qué es
Motion anima componentes con una sintaxis muy corta: cambias unas props y él calcula la transición. Incluye animaciones de entrada y salida, gestos y scroll. Es la opción por defecto si tu proyecto ya usa React. La librería es MIT y completa; aparte se vende Motion+, un pago único con componentes premium y herramientas de autor.
- react
- transiciones
- gestos
Combina bien con
Herramientas de otras categorías que suelen ir juntas en un mismo proyecto.
Alternativas en Animaciones
Ordenadas de principiante a avanzado. Compáralas con Motion lado a lado.
- Anime.jsLibrería ligera para animar casi cualquier cosa: CSS, SVG, atributos y objetos JS.GratisPrincipiante
- LenisScroll suave, el efecto de las webs de agencia.GratisIntermedio
- GSAPEl motor de animación más potente, y funciona sin framework.GratisAvanzado
- Three.jsLa librería estándar para mostrar gráficos y escenas en 3D dentro del navegador.GratisAvanzado
¿Dudas entre Motion y Anime.js?
Ponlas lado a lado: precio, nivel, cuándo conviene cada una y cómo se empieza.