---
url: "/tinyimage/tutorials/export-animated-webp-images-from-figma.md"
description: "This tutorial shows how to use the TinyImage Figma plugin to create an animation from selected Figma layers and export it as an Animated WebP file. It also demonstrates adjusting playback settings like delay, size, and quality before saving and viewing the final WebP in a browser."
---

# Export animated WebP images from Figma

> This tutorial shows how to use the TinyImage Figma plugin to create an animation from selected Figma layers and export it as an Animated WebP file. It also demonstrates adjusting playback settings like delay, size, and quality before saving and viewing the final WebP in a browser.

[← Back to TinyImage Video Tutorials](/tinyimage/tutorials)

[Embedded media](https://www.youtube-nocookie.com/embed/e8EfMxu0oog)

## What this video covers

This tutorial shows how to use the TinyImage Figma plugin to create an animation from selected Figma layers and export it as an Animated WebP file. It also demonstrates adjusting playback settings like delay, size, and quality before saving and viewing the final WebP in a browser.

## Things you'll need

- Figma
- TinyImage Figma plugin

## Steps

1. Open Figma, go to the Resources icon, search for TinyImage, and run the TinyImage compressor plugin or add it to Saved plugins.
2. Open TinyImage from Plugins > Saved plugins, then select the image layers you want to include in the animation.
3. Open the **GIF** tab, choose the **Create a GIF/MP4** subtab, and review the animation settings such as frame order, duration, per-frame overrides, size, and quality.
4. Change the export format from Animated GIF to Animated WebP.
5. Click Export WebP, then save the file when prompted.
6. Open a browser and drag the saved WebP file in to view the animated image.

## Useful links

- [Watch the full video on YouTube](https://www.youtube.com/watch?v=e8EfMxu0oog)
- [Read the full video transcript](https://www.hypermatic.com/tutorials/how-to-export-animated-web-p-images-from-figma-using-tiny-image)
- [Read: Creating animated WebP images from layers](/tinyimage/animated-webp)
- [Next: Export animated MP4 videos from Figma](/tinyimage/tutorials/export-animated-mp4-videos-from-figma)
- [Open TinyImage in the Figma Community](https://www.figma.com/community/plugin/789009980664807964)