Claude MarketplacesSubmit
vercel-labs avatar

Web Design Guidelines

vercel-labs/agent-skillsOfficial

A solid UI audit tool that pulls the latest Web Interface Guidelines from Vercel's GitHub repo and checks your code against them. Point it at your HTML, CSS, or component files and it'll flag accessibility issues, design inconsistencies, and UX problems in a clean file:line format. The guidelines stay current since it fetches fresh rules on each run rather than using stale built-in checks. Handy for catching common web standards violations before they ship, especially if you're working fast and might miss obvious accessibility or usability issues.

install copies · 90 days. Times the install command was copied on this site in the last 90 days, bots filtered.
2.4K
skills.sh installs
843.6K
GitHub stars
33.8K
last updated
Aug 21, 2026
View on GitHub

Install

$ npx -y skills add vercel-labs/agent-skills --skill web-design-guidelines --agent claude-code

Installs into .claude/skills of the current project.

Files

Web Interface Guidelines

Review files for compliance with Web Interface Guidelines.

How It Works

  1. Fetch the latest guidelines from the source URL below
  2. Read the specified files (or prompt user for files/pattern)
  3. Check against all rules in the fetched guidelines
  4. Output findings in the terse file:line format

Guidelines Source

Fetch fresh guidelines before each review:

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

Use WebFetch to retrieve the latest rules. The fetched content contains all the rules and output format instructions.

Usage

When a user provides a file or pattern argument:

  1. Fetch guidelines from the source URL above
  2. Read the specified files
  3. Apply all rules from the fetched guidelines
  4. Output findings using the format specified in the guidelines

If no files specified, ask the user which files to review.

SKILL.md on GitHub

Sponsors

Promote your product hereReach 125k+ visitors monthlyPromote your product hereReach 125k+ visitors monthlyAgent CaffeineSponsoredClose your lid, come back to finished workSnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthlyWaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthlyknobsSponsoredSee your site on any phone, any day, in any language

Details

Repository
github.com/vercel-labs/agent-skills
Categories
Git & Pull Requests, Code Review & Quality, AI & Agent Building, Cloud & Infrastructure, Design & UI/UX

More from vercel-labs/agent-skills

All 14

Recommended

More Git & Pull Requests
1stablyai avatarorca-clistablyai/orcaUse the public `orca` CLI to operate Orca-managed worktrees, folder contexts, terminals, repos, automations, artifacts, skill sharing, worktree comments, and th360.1Kskills.sh installs
2obra avatarexecuting-plansobra/superpowersUse when you have a written implementation plan to execute in a separate session with review checkpoints257.5Kskills.sh installs
3emilkowalski avatarfind-animation-opportunitiesemilkowalski/skillsSearch a codebase or UI for places that don't animate but should, and reject everything that shouldn't. Read-only; it proposes motion with exact values, it does244.1Kskills.sh installs
4mattpocock avatarqamattpocock/skillsInteractive QA session where user reports bugs or issues conversationally, and the agent files GitHub issues. Explores the codebase in the background for contex198.7Kskills.sh installs
5firebase avatarfirebase-app-hosting-basicsfirebase/agent-skillsDeploys and manages full-stack web applications (Next.js, Angular) with Server-Side Rendering (SSR) using Firebase App Hosting. Use when deploying Next.js/Angul176.9Kskills.sh installs
6vercel-labs avatarwriting-guidelinesvercel-labs/agent-skillsReview docs/prose for Writing Guidelines compliance. Use when asked to "review my docs", "check writing style", "audit prose", "review docs voice and tone", or 122.4Kskills.sh installs