Web Design Guidelines

Name: Web Design Guidelines
Author: vercel-labs

vercel-labs/sandcastle

15 installs
48 repo stars
Updated February 16, 2026
vercel-labs/sandcastle

This is a copy of web-design-guidelines by vercel-labs - installs and ranking accrue to the original listing.

Audit UI source files against Vercel’s live Web Interface Guidelines and get terse file:line findings before you ship or iterate on accessibility and UX.

About

web-design-guidelines is a checker skill for solo builders who want agent-assisted UI reviews without maintaining a local rulebook. When someone asks to review UI, check accessibility, audit design, or validate a site against best practices, the agent pulls fresh Web Interface Guidelines from Vercel’s public source, reads the paths or patterns you specify, and reports violations in the compact file:line format the guidelines define. It suits React and web frontends on SaaS dashboards, marketing sites, and browser extensions where small teams skip dedicated design QA. Use it during Build while polishing components and again in Ship before merge or deploy so regressions surface early. The workflow is deliberately simple: fetch, read, apply all rules, emit findings—no scoring theater. Pair it with your own component tests; this skill does not replace manual screen-reader checks or live performance audits.

Fetches the latest rules from Vercel’s web-interface-guidelines command.md before every run
Reviews user-supplied files or globs against the full fetched guideline set
Outputs findings in terse file:line format per the upstream guideline spec
Covers accessibility, UX, and web interface best practices in one pass
Prompts for file targets when none are provided

Web Design Guidelines by the numbers

15 all-time installs (skills.sh)
+2 installs in the week ending Jul 27, 2026 (Skillselion tracking)
Security screen: MEDIUM risk (skills.sh audit)
Data as of Jul 27, 2026 (Skillselion catalog sync)

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

Add your badge

Show developers this skill is listed on Skillselion. Paste this into your README.

[![Listed on Skillselion](https://skillselion.com/badge/skills/vercel-labs/sandcastle/web-design-guidelines.svg)](https://skillselion.com/skills/vercel-labs/sandcastle/web-design-guidelines)

Installs	15
repo stars	★ 48
Security audit	2 / 3 scanners passed
Last updated	February 16, 2026
Repository	vercel-labs/sandcastle ↗

What it does

Audit UI source files against Vercel’s live Web Interface Guidelines and get terse file:line findings before you ship or iterate on accessibility and UX.

Files

SKILL.mdMarkdownGitHub ↗

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.