React animation libraries

Oct 22, 2020listsreactlibraries

Take a look at React animation libraries that can be integrated with React for interactive and attractive web pages.

Editor's Picks


Framer Motion

Framer Motion is a production-ready animation library for React. It does spring animations, keyframes, gestures, layouts, svg paths, and a whole lot more.

React Spring

react-spring is a spring-physics based animation library that should cover most of your UI related animation needs. It gives you tools flexible enough to confidently cast your ideas into moving interfaces.

React Motion

React Motion is a popular library for animations in React. It makes use of physics to create animations that feel natural. All we have to do to create realistic animations is provide values for stiffness and damping and React Motion takes care of the rest.

React Transition Group

React Transition Group is not an animation library like React-Motion, it does not animate styles by itself. Instead it exposes transition stages, manages classes and group elements and manipulates the DOM in useful ways, making the implementation of actual visual transitions much easier.

React Move

A library to animate HTML, SVG & React-Native. Fine-grained control of delay, duration and easing

React Reveal

React Reveal provides a dead simple way to add cool reveal-on-scroll animations to your React app. In addition, it has a first class support for collapsing elements thereby abolishing the need for the universally hated popups.

React Lottie

React Lottie is a wrapper on lottie-web to render After Effects animations.