lottieditorSVG to Lottie
Drop your SVG file here
.svg · Up to 80 MBHow to animate an SVG as Lottie
- Upload an SVG file.
- Choose Spin, Pulse, Float, or Fade in, then set the duration.
- Download Lottie JSON or dotLottie, or open the result in the editor.
Motion for icons and illustrations
Spin rotates the artwork, Pulse changes its scale, and Float moves it vertically. Fade in reveals it by changing opacity. These presets animate the artwork as a group. Open the editor to give individual shapes their own keyframes.
Editable shapes and SVG effects
Simple vector shapes become editable layers. SVGs with gradients or effects may be rasterized to preserve their appearance, so those imports behave as an image layer. Preview the converted result before using it in your app.
SVG input limits
The SVG canvas must be between 1 and 4096 pixels in each dimension. Scripts and external links are rejected. Convert text to paths when exact lettering matters. CSS and SMIL animations are not translated into editable keyframes; import static artwork and add motion here.
Check before you ship
Try the sample logo first, choose a motion preset, and inspect the first and last frames. Watch for clipping when the artwork rotates. Opening the project in the full editor preserves your artwork and preset keyframes.