To get started, install the Zeplin plugin in Figma: https://zpl.io/figma-plugin

Once the plugin is installed, you can now right-click anywhere on your canvas and select “Plugins > Zeplin”, to launch it:

You can export as many frames or components as you’d like to Zeplin—notice the plugin displays how many you have selected.

Once you’re ready and the number of frames and components displayed in the plugin is correct, click on the Export button:

There, you can create a project or select a project or styleguide to publish into. The plugin will then export all of the necessary assets and layer data from Figma into Zeplin.

💁‍♀️ On the project selection window, you can switch between your workspaces to choose the desired project or styleguide.

☝️ If you export a large number of frames, the export process may take a bit longer since Zeplin will need to generate more assets.

Zeplin remembers the projects you exported your designs previously. This helps you to re-export your designs with one click later on. Check out this article to learn more about how re-exporting works.

💁‍♀️ Zeplin has 100 character limit for screen names. If your artboard has a name with more than 100 characters, it’ll be trimmed to 100 in Zeplin.

Exporting components works exactly the same as exporting frames. You can learn more here.

Seeing file location

Zeplin shows the Figma file location on the right panel of the screen both on the Mac app and the Web app, depending on members' roles in their workspaces:

  • Free plan: All project members

  • Team plan: Editor/Developer, Admin, and Owner

  • Organization plan: Editor, Admin, and Owner

  • Enterprise plan: Editor, Admin, and Owner

You can directly open the design file in Figma by clicking on the file name.

Next up: Collaborating with your team

Did this answer your question?