How our agents build on-brand pages with design.md

Vercel’s design.md addresses a gap in agent-driven design workflows: maintaining brand consistency outside controlled codebases. Previously, agents relied on repository-specific files like product-design, which included design system references and product guidelines. However, these files were inaccessible to agents operating in external tools, such as those generating reports or proposals. design.md consolidates this guidance into a single public file, enabling agents to produce on-brand outputs regardless of their environment.

The development of design.md was not straightforward. Initial attempts to port existing guidance into a public prompt failed because agents interpreted subjective design language differently. For example, phrases like 'keep the layout clean' lacked concrete meaning without contextual examples. Vercel resolved this by testing changes to design.md against a fixed set of eval prompts, derived from real use cases like renewal proposals and benchmark reports. This iterative process ensured the file’s guidance was both interpretable and effective across different agents.

The system relies on three components: design.md for structural and stylistic guidance, a public stylesheet defining a bounded vocabulary of classes and tokens, and an evaluation loop to refine the guidance based on human feedback. This structure allows agents to shape pages for both quick executive reads and detailed audits, while also standardizing copywriting and composition. The approach demonstrates how deterministic checks and repeatable evals can reduce variability in agent outputs, a challenge for any platform integrating AI-driven design tools.

For engineers, the implications are practical. design.md provides a template for encoding brand consistency into agent behavior without requiring access to internal repositories. However, the method’s effectiveness depends on the quality of the eval prompts and the rigor of the feedback loop. Platforms adopting similar systems will need to invest in iterative testing to ensure outputs align with their design standards. The trade-off is clear: while design.md reduces variability, it requires ongoing maintenance to adapt to evolving brand guidelines.