Support for design token standard

Since the design token standard has matured and is being adopted by major vendors, I would love for it to be supported by Penpot.

For more information, please see: https://www.w3.org/community/design-tokens/

Ideally what I’m looking for is the ability to use tokens from the file provided which in turn can be used to style any artifacts on an art board. This would merely be the starting point, and in the future more functionality could be added.

9 Likes

I am somewhat new to the topic of design tokens, but seems to me to be very close to the idea of Penpot to unite be both for designers and developers. Instead of reinventing the wheel it probably a very good idea to join the cause that w3c is tackling with the universal design tokens system.

Would love to hear more from the team about this.

1 Like

Agreed. I think that this is where Penpot can really cut out the competition. Figma heavily skews designer tool, but what would it look like to build something a bit more in the middle, that can be more useful for devs outside of referencing autogenerated CSS.

Figma allready incorporates design tokens via a plugin. And it works quite nice with devs via gihub. They are not llosing any time :confused:

This video shows a workflow quite nicely. Advanced Tutorial: Figma Design Tokens (Superpower) - YouTube
Figma commits json to github, style dictionary compiles json to css vars and its ready for development.

2 Likes

I was just watching Jan Six from GitHub talking about using design tokens and the plugin he made to make it work between code and Figma. Made me come over here to see if anyone has been talking about it and apparently you are :slight_smile: How design tokens can make us better collaborators - Jan Six (Config 2022) - YouTube

Seems like something that should live in PenPot with their mission to make dev and design talk the same language and make handoff a thing of the past.

1 Like