Tokens
The boring, standard substrate everything above it stands on.
Nothing downstream works without a standard, boring substrate. As of October 2025, we finally have one, and boring is exactly the point.
The summary
The gist in a few sentences, then the full argument for this layer.
Design tokens stopped being a translation tax in October 2025, when the Design Tokens Community Group shipped its first stable, vendor-neutral format.
Boring is the point: once the format is settled, the work moves up to where it matters, governance, architecture, and getting design intent into code on every platform.
Keep them three tiers deep, never let a component point at a raw primitive, and the whole agent stack above gets easier instead of inheriting the mess.
For years, design tokens were a translation tax. Every tool had its own dialect, and teams burned weeks converting between them. That is done. In October 2025 the Design Tokens Community Group shipped DTCG v2025.10, the first stable, vendor-neutral format. The file shape stopped being the argument.
That sounds boring. Boring is the point. When nobody fights about the format, the work moves up to where it matters: governance, architecture, and getting design intent into code on every platform.
Here is the distinction that trips people up. A token is not a variable. A variable is storage. A token is a decision, encoded so it survives a jump from web to native without a rewrite. Miss that and you build a system that looks fine and collapses at scale.
Why teams do the work: a full brand refresh, color, radius, shadows, drops from weeks of manual coordination to a single source edit through token PRs and visual review. One source of truth, swapped once.
The traps are predictable. Do not build past three tiers (primitive, semantic, component). Do not rename tokens to feel tidy, that is a breaking change; deprecate instead. Do not let components point at raw primitives, or dark mode becomes a three-month job instead of a fifteen-minute swap.
Tokens are the foundation the whole agent stack stands on. Get them boring, standard, and lintable, and everything above them gets easier. Skip it, and every layer above inherits the mess. But values alone only tell an agent what a thing is, not what it means or when to use it. That is the next layer's job.
The narrated overview
The same layer, heard. Self-hosted and played from a token-driven player.
The annotated sources
The originals, each with one line on why it matters. The annotation is the judgment, and the judgment is the authority.
- DTCG Design Tokens Community Group The DTCG's home base. Start here for what tokens are and who is setting the standard.
- W3C The first stable spec, v2025.10 The moment it stopped being a draft. DTCG v2025.10, the first stable, vendor-neutral spec.
- Repo DTCG working repository Where the spec actually lives. The working repo and the technical drafts.
- Field note Malaka Venu, why boring wins On why a boring format is the win, with the six-weeks-to-one-day refresh number.
The notebook
Interrogate the curated corpus directly, and ask the thing this page did not cover.
Try asking
- What changed when the DTCG spec reached its first stable version?
- Why is a component pointing at a raw primitive a future dark-mode problem?
- How is a token different from a variable?
Tokens, answered
The questions readers bring to this layer.
-
What is a design token?
A design token is a design decision stored as data, not a hardcoded value. One named entry, like color.brand, holds the value once, so every platform reads the same source instead of drifting copies. The W3C Design Tokens Community Group sets the open standard for them.
-
What is the difference between a design token and a CSS variable?
A CSS variable is storage. A token is a decision. The variable holds a value for one platform. The token encodes the intent behind it in a neutral format that survives the jump from web to native without a rewrite. Every token can compile to a CSS variable, but not the reverse.
-
Why do AI agents need design tokens?
Because tokens give an agent your exact values instead of a guess. Without them it picks a close-enough hex and your brand drifts. With them, a brand refresh that took six to eight weeks of manual coordination drops to about a day, one source swapped once, per Malaka Venu's write-up.
-
What is the DTCG format, and is it a real standard yet?
Yes, it's real as of October 28, 2025. The Design Tokens Community Group shipped its first stable version, Format Module 2025.10: an open, vendor-neutral format storing each token as JSON with $value, $type, and $description. Before it, every tool spoke its own dialect. That fragmentation is what it ends.
-
What is Style Dictionary, and do I need it?
Style Dictionary is an open-source build tool that compiles one set of tokens into platform code: CSS, iOS, Android, and more. You don't strictly need it, but it's the common path. It added first-class DTCG support in version 4. This site's own tokens compile through it.