AI-Native Design System
An AI-native design system encodes tokens, components, and rules that both designers and coding agents can consume—often via DESIGN.md, SKILL.md, or structured exports.
It goes beyond visual specs to include prompting guidance, state machines, and trust patterns for AI surfaces.
Share
What it means
A design system with machine-readable context: component intent, allowed variants, AI-specific states (streaming, citing, failing), and agent install instructions.
Why designers should care
Teams using Cursor, Claude Code, or Figma MCP need systems agents can follow. Without AI-native docs, generated UI drifts from brand and accessibility.
Example
DESIGN.md lists composer, citation, and confidence components with “never use for destructive confirm” rules; agents load it before generating screens.
Common mistakes
- • Exporting only colors and fonts without behavior or accessibility rules.
- • No documented patterns for AI-specific states.
- • Letting each squad invent its own citation or streaming UI.