Code Review & Testing · IN-DEPTH PROFILE

Web Design Guidelines Skill

Review interfaces against practical web design and accessibility rules.

View listed source ↗Installation guide ↓
Best for

Frontend engineers reviewing UI changes

What you get

Audit accessibility + Review interface quality

Main limitation

It depends on network access and a live guideline document whose contents can change over time.

First risk

Rule drift or context-free findings. A live ruleset may change between reviews, and mechanically applied guidance can create false positives. Record the source revision and evaluate each finding in context.

EVIDENCE FRESHNESS

Three checks, kept separate

A recent source check is not a runtime test or security audit.

Upstream sourceChecked 2026-09-24

Pinned revision · 063bee94

Open pinned commit ↗
SkillSignal profileSource-grounded

Updated 2026-08-20

Runtime & securityNot independently verified

Source review does not certify behavior or safety.

IN PLAIN ENGLISH

What it does—and when it fits

Web Design Guidelines is Vercel's focused interface-review workflow. For each review it fetches the latest guideline source, reads the files named by the user, applies the relevant accessibility and interface rules, and returns terse file:line findings rather than silently changing the implementation.

This is aimed at Frontend engineers reviewing UI changes. Compare the examples below with your task, then review the limitations, permissions, and risks before installing.

What you get
  • Audit accessibilityCheck specified interface files for accessibility failures covered by the current guideline set.
  • Review interface qualityFlag relevant interaction, typography, layout, content, and implementation issues.
  • Produce actionable findingsReturn concise file and line references that a developer can verify and fix.
What makes it different
  • This profile is manually organized around the current upstream SKILL.md workflow.
  • The capability boundary remains explicitly tied to vercel-labs.
  • Core uses, limitations, and risks are separated for pre-install review.
Community signalskills.sh All-time: #48 · 670.4K installs

No verified review text is in the current dataset. Use the linked source for the latest discussion.

Read the source note ↗

INSTALL BY AGENT

Choose your Agent

Paths come from official Agent docs or the universal installer behind skills.sh. Compatibility still follows this Skill's record.

Native

This Skill's current record explicitly names this Agent. Still inspect scripts, permissions, and external dependencies first.

Project install (recommended)
npx skills add https://github.com/vercel-labs/agent-skills --skill web-design-guidelines --agent claude-code
Personal install
npx skills add https://github.com/vercel-labs/agent-skills --skill web-design-guidelines --agent claude-code -g

Project install stays with this repository for team sharing. Personal install adds -g and works across repositories.

View install paths
Project path.claude/skills/web-design-guidelines/
Personal path~/.claude/skills/web-design-guidelines/
Official agent docs

Claude Code discovers custom Skill folders automatically at project or personal scope.

View path evidence ↗

TYPICAL WORKFLOW

A practical workflow

01

Audit accessibility

Check specified interface files for accessibility failures covered by the current guideline set.

02

Review interface quality

Flag relevant interaction, typography, layout, content, and implementation issues.

03

Produce actionable findings

Return concise file and line references that a developer can verify and fix.

THE TRADEOFFS

Advantages and tradeoffs

Notable strengths

  1. This profile is manually organized around the current upstream SKILL.md workflow.
  2. The capability boundary remains explicitly tied to vercel-labs.
  3. Core uses, limitations, and risks are separated for pre-install review.

Limitations

  1. It depends on network access and a live guideline document whose contents can change over time.
  2. It reports issues rather than implementing fixes, and some findings still require product-context judgment.

COMPARE THE TRADEOFF

Consider these close alternatives

These are deterministic nearby candidates, not paid placements or a universal ranking. Open the full profile before choosing.

01

Same job family · native to Claude Code + Codex

frontend-design

Design constraints that push generated interfaces beyond generic AI UI.
Tradeoff to check
Aesthetic judgments remain subjective and still need stakeholder review.
First risk
Style over function · Medium
Source state
Pinned · 34040c9c
Open frontend-design profile ↗
02

Same job family · native to Codex + Claude Code

anti-ui-slop

Instruction-only, product-specific UI design contracts with optional real-interface evidence and a hard finish gate.
Tradeoff to check
Repository evidence is required; UIZZE references or user-provided screenshots are optional, and missing reference evidence should be labeled rather than guessed.
First risk
Copying external interface patterns too literally · Medium
Source state
Pinned · 1f564408
Open anti-ui-slop profile ↗
03

Same job family · native to Codex + Claude Code

grill-me

Relentless decision interviews for sharper plans and designs.
Tradeoff to check
The package is a launcher that calls the separate grilling Skill; installing grill-me alone may not include the interview itself.
First risk
Decision fatigue · Low
Source state
Pinned · c55ee460
Open grill-me profile ↗
Compare more in the directory →

BEST FIT

Who it is for

→

Frontend engineers reviewing UI changes

→

Design-system and QA teams

BEFORE YOU USE IT

Risks to review before use

Medium

Rule drift or context-free findings

A live ruleset may change between reviews, and mechanically applied guidance can create false positives. Record the source revision and evaluate each finding in context.

Medium

Upstream instruction drift

Behavior can change with upstream updates. Record the commit used for important workflows and review updates before adoption.

SECURITY

What the permission profile means

  • Declared access remains governed by the current upstream SKILL.md and runtime requests.
  • Treat repository files, web content, and tool output as untrusted input.
  • SkillSignal has not independently executed or security-audited this package; external skills.sh labels are not SkillSignal certification.

Not a security certification. External ratings are attributed references. SkillSignal has not independently executed or security-reviewed this Skill.

COMMON QUESTIONS

Web Design Guidelines Skill FAQ

What is the Web Design Guidelines Skill?

Review interfaces against practical web design and accessibility rules. Web Design Guidelines is Vercel's focused interface-review workflow. For each review it fetches the latest guideline source, reads the files named by the user, applies the relevant accessibility and interface rules, and returns terse file:line findings rather than silently changing the implementation.

How do I install the Web Design Guidelines Skill?

Open and review the listed source, choose the project or personal path for your Agent, then verify the first run in a controlled project. Open the listed skills.sh page and upstream repository; verify the current SKILL.md.

Is the Web Design Guidelines Skill safe to use?

SkillSignal checked the source on 2026-09-24, but that is not a runtime test or security certification. Review the “Rule drift or context-free findings” risk first and begin with the least access required.

INSIDE THE PACKAGE

Indexed files

SKILL.mdUpstream Skill instructionsSource-linked

TAGS

ui-reviewaccessibilityweb-guidelines

Manually expanded from the current upstream SKILL.md and linked source at vercel-labs, checked 2026-08-20. This is an original summary, not an execution result or security certification.