Eggstractor

About this plugin

Design-to-code, simplifiedEggstractor is a Figma plugin that exports designs as SCSS mixins or Tailwind styles, allowing developers to build components their way while keeping styling updates seamless. By separating structure from styling, Eggstractor ensures that design changes don’t disrupt component architecture. And with automated code generation for updates, dramatically speed up iteration and reduce development overhead.Designers: Easily update component designs and push them directly to code—no developer implementation needed.Developers: Maintain full control over component structure while receiving Figma-driven style updates as branched pull requests for review before merging.For an end-to-end setup and demo, check out our Getting Started Guide.How It WorksConnect to your GitHub or GitLab repo.Structure your coded components to use your preferred Eggstractor output.When designs change in Figma, run the plugin to generate updated styling output.Review, then click to create a pull request.A developer reviews and merges, and the changes are live.Current StatusEggstractor is actively in development. While not all CSS properties are supported yet, our roadmap includes full support for core CSS properties, followed by an open-source design system built to leverage Eggstractor.Eggstractor is an open source project by Bitovi. Contributions are welcome! Get involved at github.com/bitovi/eggstractor.Need some help?Check out our Getting Started Guide.Need more help?Chat with us on Discord | Send GitHub feature requests | Email to [email protected] pros to help design & build your design system or app? That’s Bitovi!