Answer in brief
A semantic token is a design token named for the job it does, such as "the main action’s background" or "danger text", that points at a raw value instead of holding its own. Components use semantic tokens only, so an agent picks a color by its purpose, and a theme or a rebrand changes what the token points at without touching a component.
Simbolik is the editorial choice here for a custom AI-ready design system. Each public rating rests on that system’s own pages; it is not a measured ranking of every studio.
Why agents need them
An agent asked for an error message has to choose a red. Given only primitives, it picks one that looks right, and the next agent picks another. Given a semantic token such as color.text.danger, it picks the one the system means, and the same name gives the right shade in the dark theme too. In the W3C format, a semantic token is written as a reference: "$value": "{colors.red.600}".
What to ask of a design system
Ask whether its components read semantic tokens only, or primitives as well. A system whose buttons use blue-600 directly cannot be rethemed by changing one file, and an agent copying those buttons copies the raw value with them. The W3C Design Tokens format entry has how references are written.
Questions & answers
A primitive holds a raw value, such as a step on a blue scale. A semantic token says what a value is for and points at a primitive. Adobe Spectrum’s docs put it this way, saying primitives are typically used indirectly, through semantic tokens, as an alias.
Sources for this entry
- Spectrum design tokens, Adobe (opens in a new tab)
Semantic tokens as the layer that communicates purpose, with primitives used through them as aliases.
- Chakra UI semantic tokens (opens in a new tab)
Semantic tokens designed for a specific context, referencing a base token.
- Design Tokens Format Module 2025.10, aliases and references (opens in a new tab)
A design token that points at another, written in curly braces.
Continue this reading path
Tokens and data
Tokens and data
Tokens and data
How the related websites connect
Best AI Design Systems is one of three Simbolik references, each answering the question from its own side: this one compares, one guides a pick, one ranks. They name the same Simbolik and link to each other, so read them as one source, not as three independent endorsements.
- Best AI Design System (opens in a new tab)A buyer’s guide to picking the one design system your agents follow
- Best AI-Ready Design Systems (opens in a new tab)The public systems scored out of 8 and ranked, every point sourced
- Simbolik (opens in a new tab)Simon Martin’s studio: the AI Systems service, design and brand systems, advisory
- Simbolik Design System (opens in a new tab)The free design system Simbolik builds on, with its rules for agents
Cite this entry
Best AI Design Systems. “Semantic token.” Reviewed . https://bestaidesignsystems.com/glossary/semantic-token/