# Previewing and customizing
Inspect playback, renderer, and background before inserting an animation into Framer.

The plugin preview is a preparation surface, not the final Framer runtime. Use it to make an intentional insertion, then test the resulting component in Framer Preview and on the published site.

<Image src="https://assets.docs.lottiefiles.com/static/3191b043ff-640.webp" alt="Renderer choices in the Framer animation preview" caption="Renderer choices in the Framer animation preview" zoom variant="default" srcSet="https://assets.docs.lottiefiles.com/static/3191b043ff-640.webp 640w, https://assets.docs.lottiefiles.com/static/3191b043ff-1024.webp 1024w, https://assets.docs.lottiefiles.com/static/3191b043ff-1920.webp 1920w" width="1920" height="1080" loading="lazy" data-blur="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAYAAAB4ka1VAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAgklEQVR4nGPwiUj+7xWe9H/2ohX/z1+68n/estX/PcMS//tGpvz3Dk/6ywBWEJb4/8Tpc////vn//8SZc/89QxP/g8RBGK7gwOET/9+9/fb/4JETYD6KApCRZ85f+g8Cp85d/O8ZmoCqwCc86X/37AX/V+zZ979nzkKQ3WBJ74jkPwB4kWQ5ifU5egAAAABJRU5ErkJggg==" />

## Inspect playback

- Play and pause the animation.
- Scrub the timeline to inspect individual moments.
- Toggle loop when the experience should stop after one pass.
- Cycle through available playback speeds.
- Check the artwork on a transparent and representative page background.

<Image src="https://assets.docs.lottiefiles.com/static/2e49edb3f2-640.webp" alt="Framer animation preview with the background color control open" caption="Use the background control to test the animation against the intended page color" zoom variant="default" srcSet="https://assets.docs.lottiefiles.com/static/2e49edb3f2-640.webp 640w, https://assets.docs.lottiefiles.com/static/2e49edb3f2-1024.webp 1024w, https://assets.docs.lottiefiles.com/static/2e49edb3f2-1920.webp 1920w" width="1920" height="1080" loading="lazy" data-blur="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFCAYAAAB4ka1VAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAsElEQVR4nAGlAFr/AF5qc/+8wsT/xcnM/5ulqv+/w8f/wsbK/2Bsdf9HU179AG13f//v7/L/6urt/9LV1v/o5+v/7/H1/3B5gf9FUl3/AGt1ff/j5er/4ODo/8vOz//d3OX/4Nje/212ff9GUl7/AGt2f//9/f3/+/z8/9TX2v/h39z/oIF+/2ltd/9HVWD/AF5qc/+gs7b/obS2/5GgpP+arrD/kaer/15qdP9IVWD8y2Z1+6x5U0cAAAAASUVORK5CYII=" />

## Choose a renderer

- **Automatic** uses the renderer associated with the source and required features.
- **SVG Player** is suitable for ordinary Lottie JSON playback.
- **ThorVG Player** supports dotLottie features such as multiple animations, themes, and state machines.

The plugin warns before switching an advanced file to SVG Player because those features may not survive the change.

## Use Lottie Creator for structural changes

Open the animation in Lottie Creator when you need to edit layers, timing, keyframes, easing, themes, or state-machine structure. Save the result to the intended Workspace location, return to Framer, and insert the reviewed version.

## Related

- [Recoloring an animation](/en/integrations/framer/04_prepare/recoloring-an-animation)
- [Configuring the player](/en/integrations/framer/05_insert-and-publish/configuring-the-player)
- [Using themes](/en/integrations/framer/04_prepare/using-themes)
