Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Lottie Viewer (With timeline slider)New to Visual Studio Code? Get it now.
Lottie Viewer (With timeline slider)

Lottie Viewer (With timeline slider)

Tuur Lievens

|
9,670 installs
| (1) | Free
Preview Lottie animations while you edit them
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

! This repo is a fork of Lottie Viewer from William DA SILVA which allows it to run in newer VSCode versions and adds a timeline slider.

Lottie Viewer

Lottie Viewer demo Slider demo

Visual Studio Code extension to preview your Lottie JSON files and even edit them with more confidence. Open your JSON file then, run the Lottie Preview command.

Features

  • Preview the current open Lottie JSON file
  • Basic view controls (play / pause, speed)
  • Scrub through the animation with a slider

For more information

  • Lottie documentation
  • VSCode extension
  • Lottie files for demo

Setup for development

  1. Run npm install in both root and /web directory.
  2. Run npm run build in the /web directory everytime you edit the Lottie web app

To deploy

  1. Run npm run build in the /web directory to generate the Lottie app
  2. Update version in package.json, the run vsce package and upload the generated .vsix file to the marketplace.

Enjoy!

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft