Category: Design System

  • Navigate your Components with aria-voyager

    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.

  • The Design System I Learned the Most From Was Written in … JAVA ?!?

    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.

  • Releasing Theemo v2

    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 scripts and over time they…

  • Inside Design Tokens: The Hidden Knowledge

    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.

  • Inside Design Tokens: Internals

    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.

  • Inside Design Tokens: Theming

    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?

  • Inside Design Tokens: Naming

    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.

  • Inside Design Tokens: Token Specification

    Design tokens become scalable when they are replicable. A token specification is a formula for achieving design tokens scalability and tools interoperability.

  • Inside Design Tokens: Put your Tokens on a Scale

    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.