skilld
All skills
vercel-labs avatar

/web-design-guidelines

@ba46938 official
by Vercel Labsvercel-labs/agent-skills32k stars
2,784

Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".

Ask your Agent

Use this Skill: https://skilld.dev/gh/vercel-labs/agent-skills/web-design-guidelines

This session only. Nothing lands on disk.

SKILL.md

≈52 tokens always: the name and description. ≈229 when used: this file.

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.

Source: SKILL.md on GitHub

Third-party checks

1 warning16d5 checks · Risk SAFE
  • Gen Agent Trust Hub16d

    This skill is safe and functions as intended to review user interface code against established guidelines. It retrieves reference material from a trusted organization repository and analyzes specified local files to provide feedback.

  • Socket6mo

    1 alert: gptAnomaly

  • Snyk16d

    Risk: LOW · No issues

  • Runlayer7mo

    1 file scanned · No issues

  • ZeroLeaks5mo

    Score: 93/100 · 2 sections analyzed

Provenance

Signed by skilld at ba46938. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub last month.

Steadyupdated 9 months ago

Capability

Other metadata
metadata
{
  "author": "vercel",
  "version": "1.0.0",
  "argument-hint": "<file-or-pattern>"
}

Topics

  • web-design
  • accessibility
  • ui-review
  • guidelines
  • compliance
  • ux-audit
  • code-review

README badge

README badge for vercel-labs/agent-skills/web-design-guidelines

What it does

Audits UI code against Vercel's Web Interface Guidelines by fetching the latest ruleset and reporting compliance issues in a terse format. Use this to review HTML, CSS, or component files for accessibility, design system adherence, and UX best practices.

Generated from the current SKILL.md.

Frequently asked

What design guidelines does this skill check against?
It fetches the latest Web Interface Guidelines from the Vercel Labs repository and checks code compliance against all rules in that document.
Can I use this to audit my entire site or just specific files?
You can specify individual files or patterns to review. If you don't provide a file argument, the skill will prompt you to specify which files to audit.
What output format does this skill use?
It reports findings in terse `file:line` format as specified in the fetched guidelines document.
Does this skill check accessibility?
Yes. Accessibility checks are included as part of the Web Interface Guidelines compliance review.

Generated from the current SKILL.md. These answers refresh after source changes.