Is this Lottie viewer free?

Yes. Open a file, play it, scrub frames and use the preview controls for free. You do not need an account to use the viewer.

How do I preview a Lottie JSON file online?

Drop your .json file into the viewer or click to browse. The animation plays in your browser, with timing and file details alongside it.

Can I open a .lottie file?

Yes. Select a .lottie archive in the file picker. The viewer reads its animation data locally and opens it with the same timeline, speed and background controls.

Can I check a specific frame?

Yes. Drag the frame scrubber to pause at the moment you want to inspect. The preview shows the current frame and elapsed time.

Can I slow down the animation?

Choose 0.25× or 0.5× to inspect fast movement. You can also play at 1×, 1.5× or 2×, restart the animation, and toggle looping.

Can I preview on a dark or transparent background?

Yes. Use the checkerboard to inspect transparency, or select a solid color to check the animation against a light, dark or brand-colored background.

How does local preview work?

The viewer reads your selected file and renders its animation in your browser. You can open and inspect it without uploading the source file to a VizGPT project.

Can I compare SVG and Canvas playback?

Yes. Use the renderer selector to switch the same animation between lottie-web SVG and Canvas previews.

Can I try the viewer without a Lottie file?

Yes. Choose “Try the sample rocket” in the upload area. You can explore playback, speed, backgrounds and animation details before opening your own file.

vizGPT

Free · Local file processing · No sign-up

Free Lottie preview, down to the frame

Open a Lottie JSON or .lottie file and check the motion before it goes into your website or app. Scrub to any frame, slow down a transition, and see your animation against the background it will live on.

Preview your Lottie file

See the details that matter before handoff

Review an export, check a downloaded animation, or inspect a file from a teammate. VizGPT gives you playback controls and animation details in one free browser viewer.

Catch the frame you want

Drag the timeline to pause on a specific frame. Check an entrance, a transition, or the end of a loop without trying to hit pause at just the right moment.

Review timing at your pace

Play at 0.25×, 0.5×, 1×, 1.5× or 2× speed. Slow down fast motion, replay from the start, or turn looping off to watch the ending.

Check colors against your background

Use the transparency checkerboard or choose a solid background color. See whether pale strokes, shadows and edges read clearly on the screen you are designing.

Compare SVG and Canvas rendering

Switch between lottie-web SVG and Canvas previews for the same animation. Review how each browser renderer draws your file before choosing a web integration.

Read the animation specs at a glance

See dimensions, duration, frame rate, total frames, layer count and Bodymovin version alongside the preview. File size appears with your loaded file for handoff reference.

Open your file locally

The viewer reads and renders your selected animation in your browser. Start with your own .json or .lottie file, or try the sample rocket. No account or software installation needed.

Preview Lottie JSON without setting up a player

Have a Bodymovin export or a downloaded .json animation? Drop it into the viewer to see the animation play. The page uses lottie-web, so you can inspect the motion in a browser before adding a player to your project.

Lottie JSON describes animation layers, shapes and keyframes. The viewer turns that data into a live preview and displays its dimensions and timing beside it. Keep your source file ready for the next step in your design or development workflow.

Open .lottie files in the same viewer

A .lottie file packages animation data in a compressed archive. Choose it in the same file picker you use for JSON. VizGPT reads the animation data locally and opens a preview with the same playback controls.

Use the timeline, speed settings and background picker to review the motion. Designers can inspect a delivered animation, and developers can read its frame rate, duration and dimensions before integration.

How to preview a Lottie animation

Start with a file or try the sample. The viewer is free and opens without sign-up.

1
Open your file
Drag in a .json or .lottie file, or click to browse. The picker accepts files up to 100 MB. No file handy? Choose “Try the sample rocket.”
2
Watch it play
Playback starts when the animation loads. Pause, restart or switch looping off to review the sequence.
3
Inspect the timing
Scrub to a frame and choose a playback speed from 0.25× to 2×. Use the time and frame readouts to pinpoint the moment you want to discuss.
4
Check its appearance
Try your intended background color or the transparency grid. Switch between SVG and Canvas to compare browser rendering.
5
Take the details into your handoff
Check dimensions, frame rate and duration beside the preview. Share your observations with your team, or open the separate Lottie Editor when you want to change colors or layers.

A useful first stop for your next animation

Keep the review focused on the screen you are building and the motion you want people to see.

Design review: Pause on the frame you want to discuss and check color contrast against your intended background.
Developer handoff: Read the dimensions, frame rate and duration before configuring the animation in your project.
Loop review: Watch the ending with looping off, then turn looping on to check how the sequence repeats.
Web renderer choice: View the same file with SVG and Canvas before deciding which browser renderer to use.

Need a color change after reviewing? See the separate Lottie Editor in action. Open the Lottie Editor

Questions about Lottie preview

Get started with your file and make the most of the viewer.

Is this Lottie viewer free?: Yes. Open a file, play it, scrub frames and use the preview controls for free. You do not need an account to use the viewer.
How do I preview a Lottie JSON file online?: Drop your .json file into the viewer or click to browse. The animation plays in your browser, with timing and file details alongside it.
Can I open a .lottie file?: Yes. Select a .lottie archive in the file picker. The viewer reads its animation data locally and opens it with the same timeline, speed and background controls.
Can I check a specific frame?: Yes. Drag the frame scrubber to pause at the moment you want to inspect. The preview shows the current frame and elapsed time.
Can I slow down the animation?: Choose 0.25× or 0.5× to inspect fast movement. You can also play at 1×, 1.5× or 2×, restart the animation, and toggle looping.
Can I preview on a dark or transparent background?: Yes. Use the checkerboard to inspect transparency, or select a solid color to check the animation against a light, dark or brand-colored background.
Which animation details can I see?: The viewer displays dimensions, duration, frame rate, total frames, layer count and Bodymovin version. The loaded file also shows its size.
How does local preview work?: The viewer reads your selected file and renders its animation in your browser. You can open and inspect it without uploading the source file to a VizGPT project.
Can I compare SVG and Canvas playback?: Yes. Use the renderer selector to switch the same animation between lottie-web SVG and Canvas previews.
Can I try the viewer without a Lottie file?: Yes. Choose “Try the sample rocket” in the upload area. You can explore playback, speed, backgrounds and animation details before opening your own file.

No Lottie file to preview? Describe one

Type the motion you want. The AI generator builds the Lottie and plays it back right away, ready to refine.