Intent-Based Design Tokens

Simple Definition

Intent-based design tokens are design tokens named by their purpose or decision, instead of their raw value.

A token like background-card tells you what the color is for. A token like gray-100 only tells you what value it is. Intent-based naming captures the design decision, not just the pixel.

Why the Naming Matters

• It makes the design system easier to read and maintain
• It survives visual changes, background-card can change shade without renaming
• It guides AI coding agents toward the right choice, because the name describes the use case
• It is a building block of an LLM-safe design system

Example

• Intent-based: background-card, text-muted, border-danger
• Value-based: gray-100, slate-500, red-600

When a coding agent sees background-card, it knows where the color belongs. When it sees gray-100, it has to guess.

Related Terms

• LLM-Safe Design System, systems that rely on intent-based tokens
• AI Coding Agent, benefits from purpose-named tokens
• Agentic Engineering, building with agents while staying in control