react-lottie

Why we included this project

React teams that want After Effects animations in their interfaces can pass animation files straight from a designer into this component. The designer exports the animation as JSON through the bodymovin/Lottie pipeline, and the developer loads that file into a React component with props controlling loop, autoplay, pause, and stop. Because the animation is vector data in a small JSON payload, it adds little weight to the bundle, and it can also be fetched from an API so it loads only when needed. The same author maintains Angular and Vue wrappers, so teams using those frameworks can reuse the same animation files. It also handles interactive motion, not just decorative autoplay: you can drive the animation forward and backward in response to user events.