# Installation
Install LottieFiles in Visual Studio Code, Cursor, or Windsurf and open the extension.

Install the LottieFiles extension from the VS Code Marketplace or from a `.vsix` package supported by your IDE.

## Requirements

- Visual Studio Code API version `1.85.0` or later.
- A project or workspace folder for local preview and generated files.
- A LottieFiles account for Workspace, CDN, Premium, and Motion System workflows.

## Install in Visual Studio Code

1. Open **Extensions**.
2. Search for **LottieFiles**.
3. Select the extension published by **LottieFiles**.
4. Click **Install**.

<Image src="https://assets.docs.lottiefiles.com/static/5ae850ab83-640.webp" alt="LottieFiles extension listing in VS Code" caption="LottieFiles extension listing in VS Code" zoom variant="default" srcSet="https://assets.docs.lottiefiles.com/static/5ae850ab83-640.webp 640w, https://assets.docs.lottiefiles.com/static/5ae850ab83-1024.webp 1024w, https://assets.docs.lottiefiles.com/static/5ae850ab83-1920.webp 1920w" width="1920" height="1080" loading="lazy" data-blur="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAYAAAB4ka1VAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAoElEQVR4nBXKTQ7BQACA0V7AEarTTks61fhNbAT1ExrRYiwsJeIKLmGNiIXeQNypcQrySd/6GeOFZhivGcxSoqVmkmhG8YponjCKlz9DTVNkf41Zj5DnE2q/JXQkrrSxrDJGrdlGVgOk6+NHPVS3Q+D7NFoNwjDEUCrAcysIYXO/XPnkOc9HxmF3ZKN1EWp4XhVHODzfLwrZLcMsCYQjv3++EUq5JNE/fwAAAABJRU5ErkJggg==" />

You can also open [LottieFiles in the Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=lottiefiles.vscode-lottie).

## Install in Cursor or Windsurf

Open the IDE's extension marketplace and search for **LottieFiles**. If the marketplace listing is not available in the installed IDE version, install the approved `.vsix` package through its extension menu.

Cursor and Windsurf do not use the same `openWalkthrough` behavior as VS Code. After installation, the extension opens or focuses the LottieFiles sidebar instead.

## Open the extension

Choose the LottieFiles icon in the Activity Bar. The sidebar opens with Explore. Sign in from the account control when you need Workspace or System.

## Troubleshooting

- **The extension is installed but no icon appears** - reload the IDE window and check that the extension is enabled for the current workspace.
- **A `.json` file opens as text only** - use the LottieFiles preview command or confirm that the JSON is recognized as a Lottie animation.
- **Sign-in does not return to the IDE** - finish authentication in the browser, return to the original IDE window, and reopen the sidebar.
- **The System tab is missing** - the feature may not be enabled for the current release or account yet.

## Related

- [Interface](/en/integrations/vscode/01_quickstart/interface)
- [IDE compatibility and troubleshooting](/en/integrations/vscode/07_reference/ide-compatibility-and-troubleshooting)