For two decades, design systems have suffered from a critical failure mode: documentation drift. As Luke Wroblewski notes in a recent analysis, teams invest heavily in creating a system, only to watch it describe a product that no longer exists. The traditional solutionβthrowing centralized design reviews and dedicated teams at the problemβis becoming obsolete. With the rise of AI agents, Wroblewski proposes a new paradigm where design systems function as an 'AI steering layer,' ensuring that every code update aligns with brand and development guidelines.
The Fragmentation Problem in Agent-Driven Development
The core issue is that AI agents democratize code production but not necessarily consistency. When marketing adds landing pages, engineering updates docs, and PMs tweak pricing pages, each agent operates with its own implicit tone, color, and spacing logic. Without a unified constraint, the site fractures into a patchwork of inconsistent implementations. Wroblewski argues that agents will 'happily implement its own tone and voice' unless explicitly steered toward a unified whole. The design system, therefore, must shift from being a reference document for humans to a mandatory constraint set for machines.
Implementation via AGENTS.md and Design Tokens
In practice, this steering mechanism relies on files like AGENTS.md, which instruct AI agents to reuse existing theme classes and CSS variables rather than duplicating values. On the Intent website, agents are directed to utilize a global stylesheet that defines colors, fonts, type sizes, and responsive grids as design tokens. When an agent is asked to add a component, such as a button, it reuses the existing Button component and its styling, which automatically adapts to dark mode. This eliminates the need for human lookup, as the agent reads the design system instructions every single time it generates code.
From Figma Specs to Code as Source of Truth
The workflow described by Wroblewski begins with Figma specs automatically translated into code via a Figma MCP connection. However, once the code is generated, the code itself becomes the source of truth. Updates such as new body fonts, responsive layouts, and dark mode adjustments are made directly in the codebase. While agents have been capable of writing changes back to original Figma files, Wroblewski notes that this has not been necessary in practice. The design system page stays current because it is built from the same code as the site, ensuring that documentation and implementation never diverge.
Key Takeaways
- Design systems must evolve from human-readable docs to machine-readable steering layers for AI agents.
- AGENTS.md files and design tokens are critical for enforcing consistency across distributed teams using AI.
- Code, not Figma, serves as the single source of truth in this workflow, with agents reading constraints every time they generate UI.
The Bottom Line
The era of 'design debt' caused by human error is being replaced by 'agent drift.' If your design system isn't a set of hard constraints for your AI coding agents, you're just waiting for your brand to fragment.