---
url: "/tinyimage/gif.md"
description: "Create animated GIFs from selected Figma layers with ordering, timing, and export settings."
---

# Creating animated GIFs from layers

> Create animated GIFs from selected Figma layers with ordering, timing, and export settings.

### Video Tutorial: Create animated GIFs

This video walks through how to animate and export GIFs from your own designs directly from Figma using the TinyImage plugin.
[Embedded media](https://www.youtube.com/embed/FYlk5a69Ewc)
### Video Tutorial: Add transition effects to animated GIF exports in Figma

This video walks through how to add fade/slide/wipe transition effects to animated GIF exports in Figma using the TinyImage plugin.
[Embedded media](https://www.youtube.com/embed/GwfVWRAS1qk)

Open the **GIF** tab and select **Create a GIF/MP4** to animate and export GIF or MP4 files from selected Figma layers.

## Edit an existing GIF

Open the **GIF** tab and select **GIF Editor**. Select one Figma layer with an animated GIF fill to enable **Use selected GIF layer**, or choose **Choose file from computer** to load a GIF from your device.

### Crop an existing GIF

After loading a GIF, select **Crop**. Draw or resize the crop area in the preview, or enter exact X, Y, width, and height values. You can move the selected area with the arrow keys for smaller adjustments.

Select **Apply crop** to crop every frame in the animation. Review the updated preview before exporting the edited GIF.

## Get started with creating GIFs in Figma

Use the pages below to configure each part of your GIF creation workflow:

  - [Select and Refresh GIF Frames](/tinyimage/gif-layers.md): Select Figma layers to use as frames and refresh the frame set at any time
  - [Order GIF Frames](/tinyimage/gif-ordering.md): Sort frames by custom order, layer order, rows, columns, or layer names
  - [Configure GIF Timing and Playback](/tinyimage/gif-timing.md): Control frame delays, loop counts, and preview playback interactions
  - [Add GIF Frame Transitions](/tinyimage/gif-transitions.md): Apply and fine-tune fade, slide, and wipe transitions between frames
  - [Set GIF Export Options](/tinyimage/gif-settings.md): Configure dimensions, fit, quality, color palette handling, and dithering
  - [Export and Download GIF Files](/tinyimage/gif-export.md): Render the final GIF and download it once processing is complete
  - [Edit an Existing GIF](/tinyimage/gif-editing.md): Resize, transform, crop, trim, retime, and optimize an existing GIF