What makes
a design system
ai-native?

[1]

Semantic, intent-based naming

Name things by intent, not appearance — role/on-accent, never white. Agents reason about a vocabulary, not a swatch.
[2]

Machine-readable contracts

Every relationship is declared by a schema — tokens, taxonomy, slots, applicability, presets, patterns. Six files; no inference from prose.
[3]

Closed, enforced choice space

Valid combinations are finite and listable. when predicates gate modifiers; a linter rejects the rest before it ships.
[4]

Slot + nesting contracts

What can be placed inside what is declared — not implied. slot.accepts turns composition into a type problem an agent can solve.
[5]

One source. Many generated outputs.

Define-once. Docs, types, lint rules and the MCP surface are all built from the same canonical spec. No drift.
[6]

Agent-navigable surface + conformance

The system answers agent queries via MCP. Implementations declare coverage; the validator confirms it.

aindf — inspect

$ aindf principles --list1. semantic-naming 2. machine-contracts 3. closed-applicability4. slot-contracts 5. single-source 6. agent-surface

Artifacts of an
AI-Native design system

Every claim on this site links to a file in one repository. The site renders from those artifacts; a build regenerates everything else.

SPEC.md: ten sections in markdown · thesis · contract graph · axes · tokens · modifiers · presets · single-source · conformance · boundary · versioning
schemas/: six json-schema files · one per axis of the contract graph (tokens · taxonomy · slots · applicability · presets · patterns)
patterns/: three starter patterns · newsletter · chat · feature-grid · with clarifying parameters an agent asks before assembly
for-agents: machine-readable entry point · llms.txt index + four MCP tools · list-by-facet · slot-accepts · applicable-modifiers · get-preset
conformance: a DS declares which principles it satisfies; the validator confirms or refutes. Partial counts — and gets a roadmap to the rest

Who implements each principle today

Real design systems already ship pieces of this. None ship the whole graph. Each note describes how that system implements the principle — followed by the AINDF artifact that formalizes it.

[1] Semantic, intent-based naming artifact · tokens.schema · taxonomy

Material 3color roles with an on- pairing (surface/on-surface) — chosen by meaning, not hex Radix Colorsa 12-step scale where the same step number is the same UI role across every palette GitHub Primerfunctional/semantic tokens layered over primitives (fgColor.default, bgColor.muted)
[2] Machine-readable contracts artifact · 6 schemas

W3C DTCGvendor-neutral JSON token format; first stable 2025.10; aliases & references Style Dictionarytokens as JSON (name + value + metadata) — a single machine-readable source Figma Variablesmachine-readable variables with explicit scopes + per-platform code syntax
[3] Closed, enforced choice space artifact · applicability + when{}

Figma scopinga variable binds only to properties in its scope (FRAME_FILL, TEXT_FILL…) — invalid bindings refused at source Tailwind CSSa constrained, finite theme scale — you compose from the allowed set, not arbitrary values Panda / vanilla-extracttyped variant recipes — the variant matrix is finite and type-checked at build Radix Primitivesconstrained, enumerated component props
[4] Slot + nesting contracts artifact · slots + accepts

Figma instance-swappreferred values constrain which components a swap slot accepts · partial Radix Slota composition primitive (asChild) — but accepts is not formalised as a contract aindfslots + typed accepts as a machine-readable contract — the gap most leave open
[5] One source, many generated outputs artifact · SPEC §7

Style Dictionaryone source → CSS, iOS (Swift), Android (XML), JS, docs Tokens Studiomanages DTCG tokens and exports to code / platforms Supernovatoken + documentation pipeline from a single source (DTCG-compatible)
[6] Agent-navigable surface + conformance artifact · for-agents · conformance

Figma Dev Mode MCPserves a frame's variables, components and styles to an agent · per-feature, no conformance

A design system is fully ai-native when it ships all six principles from one source. Most ship a subset. aindf is the spec for the whole graph.

$ git clone …/ai-native-design-framework.git

What makesa design systemai-native?

Artifacts of anAI-Native design system

Who implements each principle today

What makes
a design system
ai-native?

Artifacts of an
AI-Native design system