Add GIFs to your design files and view them in presentation view. This allows you to simulate videos or animations, and create more dynamic prototypes.

Due to browser limitations, the width or height of an image must not be larger than 4096 pixels. Figma will scale any larger images so they fit within these limitations.

Add animated GIFs

Like regular static images, you can apply animated GIFs to layers as fills. This means you to apply them to any vector shape, including text layers. There are a few ways to add GIFs to your designs:

• Drag and drop GIFs onto the canvas
• Import files via the file browser
• Add images to objects in bulk with place image
• Upload image as fills
• Copy and paste image fills between layers

View animated GIFs

Animated GIFs only play in presentation view. When viewing the file in the editor, animated GIFs appear as static images.

Identify GIFs by their GIF label in:

• Fill section in the right sidebar
• Fill modal 
• Layers panel
• Next to the image's dimensions in the canvas

Manipulate or edit GIFs

Like static images, you can also manipulate aspects of a GIF. You can:

• Scale, rotate and adjust the dimensions of GIFs
• Adjust the opacity, fill mode, and rotation of a GIF
• Apply or combine with blend modes
• Create styles and components with GIFs
• Apply masks to only show a part of the GIF
• Apply scrolling overflow settings to GIFs
• Create overlays in prototypes using GIFs

There are also a few extra options for GIFs:

• View images and animated GIFs in the Figma mobile app
• Keep and export metadata including Frame delay and # of Loops
• Choose which frame of the GIF you want to display in the canvas

There are some actions you can't take with animated GIFs. You can't:

• Apply image adjustments to GIFs. We recommend layering fills and using blend modes instead.
• View animated GIFs in the canvas (editor). Animated GIFs only play back in presentation view.
• Export animated GIFs from Figma. Figma can only export animated GIFs as static images.