What it does
Vercel’s Web Interface Guidelines collect practical interface decisions across keyboard use, focus, inputs, loading, navigation and animation. The resource identifies itself as a living, non-exhaustive reference.
Use the section that matches the interaction you are building. Interactions covers visible focus, restoring focus, normal link behavior and preserving state through refresh or Back. Forms addresses labels, autofill, submission feedback and placing errors beside the relevant fields. The animation guidance includes reduced-motion alternatives and interruptions by user input.
Most guidance is independent of a framework, with some React and Next.js details. A separate Vercel-specific section identifies brand choices such as heading capitalization and copy style, so those preferences are clearly distinguished from the wider interaction guidance.
The complete reference is free without an account. Integrate with Agents offers a review skill and a downloadable AGENTS.md file for use with coding agents.
Strengths
- Interaction details are connected to practical implementation choices.
- General interface guidance is separated from Vercel-specific writing preferences.
- The reference includes an agent review route and downloadable project instructions.
Watch out for
- Some guidance is specific to React or Next.js rather than every stack.
- The reference is deliberately non-exhaustive.
Best for
- Designers and developers reviewing web-interface behavior
Sources
- Web Interface Guidelines (Oct 27, 2026)