Learn

Design Tokens

"Design tokens are a limited set of discrete options, just like a scale of musical notes is drawn from the spectrum of all possible frequencies. Or like the presets on a car radio — not every option, just a specific selection."
— US Web Design System
"Design tokens are design decisions, represented as data, that ensure systematically unified and cohesive product experiences."
— Spectrum, Adobe’s Design System
Design Tokens are atomic, reusable building blocks of a design system, such as colors, typographic elements, motion, and even sounds and copy text.
In design systems, tokens are used in place of hard-coded values of visual primitives to ensure flexibility and cohesiveness across all products.
With Toolabs DSM, all token types can be visually managed from a single panel where you can define, edit and organize them with visual editors.
Descripn of Toolabs Design Systems panel to manage your design tokens
Naming Tokens
Every token must have a name and the name must be unique for that token type. That means, there can be a color token named Primary and a shadow token Primary but DSM does not allow to have one more color or shadow token with the name Primary
Each token must have a unique name.
Here are some good articles on naming design tokens :
Grouping Tokens
Here are some good articles on design tokens :