Style Dictionary can generate Penpot-compatible design token JSON files through custom formats and helper functions. The process involves organizing tokens into numbered folders to control import order, creating a custom format that outputs Penpot's proprietary structure with $themes and $metadata objects, and using helper functions to process core and semantic token directories. The resulting JSON file maintains token cascading order and supports multi-theme workflows, enabling design-to-development synchronization when design tokens are managed in code rather than directly in Penpot.
Table of contents
Creating Token Examples in JSON FormatA Note On Penpots Propietary .json StructureConfiguring Style Dictionary for PenpotThe Penpot-ready .json Generated ExampleWrapping UpSort: