Today we’re very excited to announce a new webinar series called: Zeplin + Figma: Better Together! In this series, we’ll talk to product and design leaders. Zeplin is now a plugin. Figma no longer supports a custom integration with Zeplin. Use the official Zeplin plugin to annotate and share your designs for handoff. For help with the plugin, reach out to the Zeplin team via the Support contact on their plugin page.
Zeplin provides capabilities much needed by developers including clarity on “finalized” designs, an accessible design workspace friendly to non-designers, added structure to design screens and of course tailored technical specs built by developers for developers.
Free picture colorizer. The Zeplin Figma plugin now has a settings menu where you can manage some options for your frames and components.
To open the settings, click on the “…” button:
Export components to styleguide
By default, Zeplin exports your components to your styleguide. If you want to change this and export your components as screens, you can disable the “Export components to styleguide“ option.
Include page in component names
When exporting components, Zeplin will export them with their given name in Figma. Sometimes, a component might have the same name, but look different and belong to a different page.
To include the page name as part of the component name, make sure to enable the “Include page in component names option” under the settings before exporting your component.
You’ll see that the components will now have the page names, like so:
Settings for the Sync feature
Zeplin Figma Integration
If you publish your designs by using the Sync feature, here are the things you can set up through the settings:
Update color names automatically
When you export your frames or components, Zeplin gets the local colors in your file and adds them to your styleguide with their names.
Zeppelin For Figma
If you rename your colors in Zeplin and don’t want to update them according to your Figma file next time, you can disable updating their names automatically.
Update screens and components
Zeplin Figma Export
You can update an existing screen or component in your project/styleguide by name or corresponding artboard in your design file.
![Zeplin Zeplin](/uploads/1/1/9/8/119877348/737685065.jpg)
To learn more about update options, please check this article.
Frame/Component order
Whether your artboards or components are laid out horizontally, vertically, both horizontally and vertically, or you numbered them in your design file, you can choose the order you want to publish them to Zeplin.
![Zeppelin Zeppelin](/uploads/1/1/9/8/119877348/566131220.jpg)
You can choose to order your frames and components by their positions or names by using the Frame/Component order option under the settings.
Splatoon™ 3 Available 2022 Ink up the Splatlands in the next Splatoon™ game! Enter the Splatlands, a sun-scorched desert inhabited by battle-hardened Inklings and Octolings. Splatoon 3 will be the first game in the series to be localized into. Splatoon 3.
Zeplin Figma React
You can learn what position and name mean here.
Sync history
With the Figma Sync feature, you can export your Figma designs with one-click to Zeplin. The plugin remembers the project or the styleguide you previously exported to and lets you sync your designs.
If you want a fresh start and don’t want to keep syncing your designs anymore, choose the frames and components you want to clear, click on the “Clear” button.
?♀️ You can use the Logout button if you want to log into Zeplin Figma Plugin with another Zeplin account.
Related articles