Awwwards Nominee

ESSAY · DESIGN SYSTEMS × AI

Design Tokens Are Prompts Now

The primary consumer of a design system changed species — and most design teams haven’t noticed.

MAURICIO JUBA · 07/2026 · 9 MIN READ

For ten years I wrote design tokens for human engineers. In 2026, the primary consumer of a design system changed species.

The old contract

A design token was always a contract: this is the blue we mean, this is the spacing rhythm — and here it is as data, so your code can consume it without a designer in the room.

At Dell, I rebuilt the Design System’s token architecture around exactly that idea. The system was stalled — strong foundations, run as a black box. The real blocker wasn’t governance, as leadership suspected; it was that the tokens were named by designers, for designers, with no export pipeline. The people actually consuming them — front-end engineers — had been ignored by the naming.

We flipped it: a simplified core + semantic hierarchy, light and dark, shipped as JSON and CSS to every dell.com surface. The lesson I’ve repeated ever since: naming is a product decision — optimize for the real consumer, not the author.

I just didn’t expect the real consumer to change again this fast.

What changed

By 2026, a large share of new UI code is machine-generated — half of designers surveyed say they’ve shipped AI-generated code to production. Claude Design reads a team’s design system straight from the codebase and applies it. Figma ships a native AI design agent. Every product team has a coding agent somewhere in the loop, emitting components at a pace no design review can inspect.

And generated UI has a specific failure mode: speed without memory. Each session, each model, each prompt invents its own paddings, its own grays, its own border radii. Individually plausible, collectively incoherent. Drift used to take an org quarters; an agent fleet manages it in an afternoon.

ONE PROMPT, FOUR SESSIONS — RENDERED WITH THEIR OWN DRIFT
SESSION 01 bg-muted · r-8 · p-12
SESSION 02 #2b2b31 ✗
SESSION 03 radius: 14px ✗
SESSION 04 #2e2c35 · p-17px ✗

Individually plausible, collectively incoherent — each session invents its own grays and rhythms.

Here’s the part that should reframe your roadmap: when an agent generates UI, it doesn’t read your Figma library. It reads your repo. Your tokens file. Your component signatures. Your docs — if they’re in a format it can parse. Figma’s own framing of its Dev Mode MCP server is that output quality tracks how connected your system is; the documented failure mode is hard-coded values sneaking in when the system isn’t machine-legible.

UNTIL NOW · HUMANS READ

FIGMA LIBRARY · STYLEGUIDE.PDF

Consumed by eyes, in a design tool — interpreted, then re-typed into code.

2026 · AGENTS READ
tokens.cssCONTEXT
tailwind.config.tsCONTEXT
·components/*.tsx
·docs/*.md
CLAUDE.mdCONTEXT

Consumed as text, in your repo — whatever is parseable is the design system.

Your design system’s machine-facing surface is now its primary interface. The token file stopped being an export artifact. It became the prompt.

Conventions erode. Compilers don’t.

If tokens are prompts, a new problem appears: prompts are suggestions. Models — like busy humans — follow them until they don’t.

Every design system I’ve worked on had governance by convention: guidelines, review rituals, a Slack channel where someone occasionally posts “please don’t hardcode colors.” It erodes. Always. New hires don’t read the wiki; deadlines beat guidelines; and now, agents hallucinate a plausible hex because it was statistically likely.

The only enforcement point that doesn’t erode is the build.

GOVERNANCE HALF-LIFE
GUIDELINES PAGEerodes in weeks — nobody rereads the wiki
REVIEW RITUALSerodes under deadlines — and agents outpace reviewers
BUILD GUARDfails CI · never sleeps · reads every diff

I tested this thesis the hard way. For my own tooling project — an authoring IDE in Rust — I rebuilt the shadcn/ui design language natively for egui: 60+ components, token-first. And I encoded the law as tests: a literal color, font size or spacing anywhere above the token layer fails the build; only the lowest layer may touch the painter. Escape hatches exist, but they’re explicit and greppable. An exception you can grep is documentation; an exception you can’t is rot.

Then I did most of the component work pairing with a coding agent, daily, for weeks. The result surprised even me: the system didn’t drift. Not because the model was disciplined — because the build was.

THE REVIEWER IS THE BUILD↻ EVERY EDIT
GENERATEThe agent emits UI — and invents a plausible gray.
GUARD FAILSA raw value above the token layer fails the build.
AGENT READSThe failure is feedback — the error names the rule.
SELF-CORRECTIt reaches for the token. No design review needed.

04 → 01 · THE LOOP CLOSES WITHOUT A HUMAN

That’s the whole thesis in one loop: I didn’t review the machine’s taste. I made taste non-negotiable at compile time.

Tokens were the easy part

“Design tokens as LLM context” is the entry point, but the appreciating asset is bigger. If I were running a design-systems team today, this would be the roadmap:

1Name for consumers — now including machinesSemantic tokens (surface, muted, destructive) carry intent a model can generalize from. A palette named blue-04 teaches it nothing.
2Adopt the standard token formatThe W3C Design Tokens spec reached its first stable version in late 2025 — theming, multi-brand, OKLCH — and Style Dictionary, Tokens Studio and Figma all consume it. The format is finally boring. Stop hand-rolling; make your tokens legible to every tool that speaks it.
3Ship rules as tests, not documentsAnything you’d write in a usage-guidelines page, ask: can this be a lint rule, a type constraint, a failing test? Every rule moved from prose to build survives both interns and agents.
4Make the docs machine-readableComponent pages in clean markdown are retrieval targets now. If your docs live where agents can’t read, they don’t exist for the fastest-growing class of consumers.
5Treat escape hatches as APIThe difference between a system and a cage is a designed exception path — explicit, attributable, greppable. Humans and agents will imitate whatever pattern they find.
6Measure drift, not adoptionAdoption was the old KPI. With generation in the loop the question is: how far does output wander from the system, and how fast is it caught? A failing build is drift caught at zero distance.

The uncomfortable part for my own field

I’ve watched designers treat the AI wave as a tooling story — which prompts to learn, which plugin to install. The structural story is bigger: the deliverable is moving. The mockup was never the product; now even the component library isn’t the product. The product is the constraint system that keeps a thousand generated screens recognizably yours.

That work is design work — it’s taste, hierarchy, intent. But it ships as tokens, tests, types and docs. The designers who can write that layer are becoming the most leveraged people in the building: one good constraint system disciplines every agent that touches the codebase, forever.

The brand-guideline PDF died twice. The first time, tokens replaced it — because humans needed data, not prose. Now the prose is dying again, as the machine-facing surface becomes primary.

Design tokens are prompts now. The build is the reviewer. Write accordingly.

PROOF BY CONSTRUCTION

The design system described here is open source: ouroboros-ui — 60+ components whose governance tests fail the build, with a live storybook running in your browser.

References — Anthropic, Claude Design · Figma, Config 2026 & design systems + MCP · W3C Design Tokens Community Group (format module reached first stable version, Oct 2025) · AI in Design Report 2026.