Skip to content
Typography Style Guide Generator

Typography Style Guide Generator

by Jan Gugler

Automatically generate text style guides based on your defined local text styles.

FreeFigma

Installs

4,320

Likes

505

Users

37,599

Views

18,869

Preview

Typography Style Guide Generator preview

About this plugin

This plugin allows you to generate a typography style guide based on your defined local styles.

The generator is especially built for teams who work according to the Tailwind Design system and use the associated naming scheme (e.g., "Heading / L / Regular").

Styles will be grouped based on the prefix before the slash and sorted by font size. Relevant font information like family, size, line height, and others will be shown per style. If there is no prefix, then the styles will be added to a group called "Other".

There are three options when running the plugin:

Create a style guide with all defined local text styles.

Create a style guide with all defined local text styles and add a tag if the style is used on the currently open page. This is especially useful if you have a large design system and thus not all styles are relevant for a subproject, but you still want to show the whole set.

Create a style guide with only the used local text styles on the current page.

Enjoy and looking forward to your feedback.

More file organization plugins plugins

View all