Web design guidelines
Vercel's design rules for agent-generated web interfaces: layout, spacing, typography, motion, state.
Installation
$ npx skills add vercel-labs/agent-skillsThe CLI's unit is the repository, so this installs everything in vercel-labs/agent-skills, not web-design-guidelines alone. It writes into whichever agent directories it finds — Claude Code, Codex, Cursor, Copilot, Windsurf, Zed.
Summary
Vercel's design rules for agent-generated web interfaces: layout, spacing, typography, motion, state.
- Reach for it when you want generated UI to be consistent across a team without a designer reviewing every PR.
- Sits in Design & architect — interfaces, module boundaries and domain language — decided before the code sets them in concrete.
- Assumes web.
- Published by Vercel Labs, who ship the thing it is about — a stronger claim than a well-regarded engineer having written something good.
- Installing pulls the whole vercel-labs/agent-skills repository: this catalogue lists 4 other entries from it, and the repo may hold more.
Where it sits in delivery
Design & architectInterfaces, module boundaries and domain language — decided before the code sets them in concrete.Everything in Design →
The skill itself
The full text lives with its publisher and changes when they change it. Read it there rather than here — a mirrored copy of somebody else's procedure goes stale silently, and this page would have no way of telling you.
Related
More in Design & architect
- Frontend designAnthropic's guidance for producing interfaces that look designed rather than defaulted.
anthropics/skills - API & interface designDesigning interfaces that are hard to misuse and cheap to evolve — naming, versioning, error shape, defaults.
addyosmani/agent-skills - Codebase designWhere module boundaries go, and what belongs on each side of one.
mattpocock/skills - Diagramming codeProduces accurate architecture and data-flow diagrams from the code that exists, not the code somebody described.
trailofbits/skills - Documentation & ADRsRecording architectural decisions so the reasoning survives the people who made it.
addyosmani/agent-skills - Domain modelingModelling the problem so that illegal states cannot be represented, instead of validating them at every call site.
mattpocock/skills