Screenshot of Typography Style Guide Generator interface

Typography Style Guide Generator simplifies creating and organizing typography guides based on local text styles. Designed with Tailwind Design system users in mind, the plugin categorizes styles using a prefix-based hierarchy (e.g., “Heading / L / Regular”) and sorts them by font size for clarity. It displays key font properties such as family, size, line height, and more, offering a detailed overview of typography setups. Styles without prefixes are automatically grouped under an “Other” category for organization.

The plugin provides three modes: generating a guide for all local text styles, creating a guide that tags styles used on the open page, or limiting the guide to styles applied to the current page. These options are particularly helpful for managing large design systems by tailoring style guides to specific needs.



More Resources Like This