Export Code

Export Code

Figma plugin to convert and export assets to code.

0 followers

Export Code is a Figma plugin that exports assets to React, Vue, Sass or TailwindCSS. Customize the code output to match your preferences & development environment, create single components from multiple assets with variants, & preview code before downloading.
Export Code gallery image
Export Code gallery image
Export Code gallery image
Export Code gallery image
Launch Team
Intercom
Intercom
Startups get 90% off Intercom + 1 year of Fin AI Agent free
Promoted

What do you think? …

David Yeiser
Hello, everyone! I’m the founder of a company called Oombla and the maker of Export Code. Oombla is a design token management company and Export Code is the company’s first product. Export Code is a Figma plugin that allows you to export assets in Figma to code. If you have an icon collection for an app for example, you can create React components for each of those icons with the click of a button. Or Vue components. Or a TailwindCSS plugin that adds classes for each icon, or Sass variables for each. The video above shows a quick walk-through of doing this for React. The most important part of the plugin is that you can edit the templates that generate the code. So you can tailor the template exactly to whatever dependencies and tools may be unique to your development setup. For the past couple years I have been doing a lot of work in the design token and design system space, specifically transforming design tokens for various platforms (e.g. web, Android, iOS/Swift). Included in these transformation projects would be transforming vector and raster assets to platform-specific setups like vector drawable assets for Android, asset catalogs for Swift, React components for web and so forth. I saw how much time this could save teams and specifically how nice it was to be able to quickly generate production-ready code for a large set of assets as part of that process. So, long story short, Export Code places that learning into a single stand-alone product for Figma. The plugin is free to download and use, but is limited to exporting five assets at a time. You can purchase a license for $25 (good for a year) that will remove that restriction. Figma link: https://www.figma.com/community/... Purchase license: https://oombla.com/purchase More about Oombla and Export Code: https://oombla.com/blog/hello-world I’m happy to answer any questions, etc. Thanks for your time! -David