Skip to main content
All CollectionsFigma Integration
Exporting assets from Figma
Exporting assets from Figma

Learn how to export assets from Figma to your project

Didem avatar
Written by Didem
Updated over 5 months ago

Exporting assets from a Figma design in Zeplin is quite straightforward. You can either mark a layer as exportable or use the Slice feature. Then, Zeplin will generate all the necessary images with different scales and formats automatically, tailored to the platform you’re designing for; Web, iOS, Android, or macOS.

Exportable layers

To mark a layer as exportable in Figma, simply add an export option to it by clicking the + button on the Export section, from the right panel.

Slices

Slices are a great way to export assets from arbitrary layers. You don't even need to add an export option to slices actually, they're exportable by default.

Assets with transparent paddings

A common use case is exporting assets slightly larger than the layers themselves, with transparent paddings around them. This is quite useful for components like menus, tab bars where all the icons should have the same size.

Using slices is the simplest way to accomplish this:

  • Add a slice, change its size as necessary.

  • Group the slice and the layer(s) together.

By default, slices are exported with their contents only, so the resulting image will only contain the layers that are grouped with it. If you'd like to include the background as well, you can do so by adding an export option and deselecting “Contents Only”.

Auto-export assets

If you want Zeplin to export your assets automatically from the layers that conform to certain patterns listed below, enable the “Auto-export assets” option in the plugin Settings.

  • Layers with names starting with icon, icn, ic, ico

  • Components that only contain shapes, like icons

Learn more about the auto-exported assets here.

If you would like to learn more about Zeplin's Figma integration or any other topics related to Zeplin, reach out to our Customer Success crew at success@zeplin.io to schedule a 30-minute call.


Related articles

Did this answer your question?