Styleguides are treated like projects, and you can see them in the project selection window while publishing your designs. This way, you can export your colors, text styles, and components directly into your styleguide.
💁♀️ Since child styleguides inherit colors, text styles, and components from the parent styleguide, you only need to export the colors, text styles, and components that are unique to that specific styleguide based on the platform type (Base, Web, iOS or Android). If you have project-level-specific resources, you can include those in your project styleguide instead. You can learn more here: Defining parent and child styleguides
Exporting components
When you export your components to your styleguide, they will be listed under the Components section in the styleguide.
When new components or component versions are exported, whether by you or other users, a green "Components updated" tag will appear next to the "Sort by" dropdown. The tag remains until you sort components by "Last updated."
You can find more details on how to export components from your design tool here:
Exporting colors and text styles
In Figma, Sketch, and Adobe XD, if you have colors and text styles defined in your design file, Zeplin detects these colors and text styles and shows them as suggestions under the styleguide's "Color Palette" and "Text Style Catalog" sections while exporting your components to a styleguide. This way, you can immediately add all of them or pick which ones to add.
You can export colors and text styles directly from the plugins in Figma and Sketch. In the Figma plugin, you’ll also have the additional option to export color variables.
Figma:
Sketch:
Adobe XD: