Web Design Guidelines

This skill audits UI code against Vercel's Web Interface Guidelines for design and accessibility compliance.

How It Works

The skill operates through four steps:

1. Fetch current guidelines — Retrieves the latest rules from the remote guidelines repository, ensuring every review uses up-to-date standards rather than a static snapshot.
2. Read target files — Accepts file paths or glob patterns to specify what should be reviewed.
3. Validate against rules — Compares all code against the complete guideline requirements covering design, accessibility, and UX best practices.
4. Report findings — Outputs issues in a concise file:line notation.

Guidelines Source

Rules are dynamically retrieved from:

https://raw.githubusercontent.com/vercel-labs/web-interface-guidelines/main/command.md

Usage

When users request UI audits—framed as design reviews, accessibility checks, or best-practice validation—the skill:

• Pulls the latest rule set
• Processes specified files or prompts for clarification if none provided
• Validates against all guideline requirements
• Reports findings in file:line format

Installation

npx skills add https://github.com/vercel-labs/agent-skills --skill web-design-guidelines

Mirrored from https://github.com/vercel-labs/agent-skills — original author: vercel-labs, license: MIT. This is an unclaimed mirror. Content and ownership transfer to the author when they claim this account.