I released Theemo, the end-to-end design token workflow tool, in v1.0. It is capable to convert design tokens into modern CSS using @property, light-dark() and color functions with the help of Style Dictionary.| Thomas Gossmann
I released Theemo, the end-to-end design token workflow tool, in v1.0. Theming (buiding CSS and packaging themes) as well as integrations with frameworks received a major overhaul.| Thomas Gossmann
Building UI components that follow the ARIA Authoring Practices Guide (APG) is a time-consuming and challenging task to capture all the many details. Here comes aria-voyager the canoe vessel that navigates your components. You bring your own markup (BYOM) and aria-voyager layers navigation on top.| Thomas Gossmann
A story of working with design systems in the web for 15+ years. Starting in a time when NPM didn't exist, when Javascript didn't have "classes", when CoffeeScript was declining, Typescript wasn't ever thought of and "Design System" wasn't an existing term … then I learned the most about them.| Thomas Gossmann
Theemo is an open source Design Token automation suite and consists of a Figma plugin, a Sync toolkit (with integrations to read from Figma and write to Style Dictionary), theme generation and framework adapters to load those to support the entire token pipeline end-to-end. It started as a bunch of| Thomas Gossmann
Tokens not only have a name and a value, they carry on a lot more data, which when given proper meaning is a knowledgeable resource.| Thomas Gossmann
Naming design tokens can sometimes be considered its own discipline. Naming is surprisingly straight forward, and if it isn't then it solves the wrong problem.| Thomas Gossmann
Ever worked with a set of design tokens that are super inconsistent and hardly distinguishable? Perhaps a wrong scale? This article explains the available scales, their problems and what to use them for.| Thomas Gossmann
Design tokens are often grouped based on their phenomenal reference sequence. From basic, over semantic to component tokens. This article compares this organization with a model based architecture and figures out the advantages and disadvantages.| Thomas Gossmann
Tokens contain a lot of information and even more the relationship between tokens. Making sense of this information is the hidden knowledge living within tokens. Unlocking this knowledge is the next evolution step for design tokens.| Thomas Gossmann
Theming in Design Systems is a de-facto standard way to exchange the look-and-feel of your product. There is a high divergence of what is a theme? What does it consist of? Which constraints exists when building a theme? When and what to use a theme for?| Thomas Gossmann
Design tokens become scalable when they are replicable. A token specification is a formula for achieving design tokens scalability and tools interoperability.| Thomas Gossmann
Design system architecture with focus on design tokens, that form the vocabulary of your visual design language, helping to streamline the communication amongst stakeholders. Modeling the system with boundaries to ensure clear purpose and predictability for design tokens and stability guarantees wit| Thomas Gossmann
Features encode user preferences, inherit behavior(s) and are communicated by several principals through agents. Design tokens may or may not support features.| Thomas Gossmann
Over the past three years, I’ve researched design tokens for usage in Theemo and I’m sharing my discoveries in this article series.| Thomas Gossmann