Web Player
Install and use @lottiefiles/dotlottie-web to render Lottie animations in the browser, with guides for playback, theming, and state machines.
@lottiefiles/dotlottie-web is the core JavaScript player for rendering .lottie and Lottie JSON animations on an HTML canvas. It works in any browser environment without a framework, and everything you can do with it — playback control, layout, theming, slots, multi-animation files, state machines — is available from a single DotLottie class.
New to the player? Start with the tutorial. Already building? Jump straight to the guides or the API reference.
Install the player
Add the package with npm, yarn, or pnpm, or load it from a CDN.
Render your first animation
A step-by-step tutorial that gets an animation playing in a plain HTML file.
How the web player works
Understand the rendering model, the .lottie format, themes, slots, and renderer variants.
How-to guides
Load animations, control playback, style the canvas, switch animations and themes.
State Machines
Build interactive animations with state machines, inputs, and events.
API reference
Every constructor option, property, method, and event of the DotLottie class.