web-design-guidelines

Reviews UI code files against Vercel Web Interface Guidelines and reports findings by line.

2|1|Updated Jun 9, 2026
One-click install
npx skills add https://github.com/zester4/zilmate --skill web-design-guidelines-zester4
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/zester4/zilmate/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/zester4/zilmate --skill web-design-guidelines-zester4

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Manually auditing UI code for accessibility, UX, and design best practices is slow and inconsistent. This Skill automates the review by fetching the latest Web Interface Guidelines and checking your files against every rule. ## Core Features & Use Cases - Guideline-Based UI Review: Fetches the latest rules from the vercel-labs web-interface-guidelines repository and applies them to your code. - Precise Findings Output: Reports violations in a terse file:line format so issues are easy to locate and fix. - Flexible File Targeting: Accepts a file or pattern argument, or prompts you to specify which files to review. - Use Case: Before shipping a new landing page, ask for a review of your React components to catch accessibility violations and UX anti-patterns against current best practices. ## Quick Start Ask the assistant to review my UI files in the components directory against the Web Interface Guidelines.

Frequently Asked Questions about web-design-guidelines

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I review my UI code for accessibility issues?

Provide a file or pattern argument and the Skill fetches the latest Web Interface Guidelines, then checks your files against every rule. Findings are reported in a file:line format so you can jump directly to each issue.

What are the Web Interface Guidelines this review uses?

The guidelines come from the vercel-labs web-interface-guidelines repository, fetched fresh from its raw command.md source before each review. This ensures the audit always uses the most current rules rather than a stale local copy.

Can I review multiple UI files at once?

Yes, you can pass a file pattern as the argument to review multiple matching files in one run. If you provide no argument, the Skill asks which files you want reviewed.

Does the UI review require an internet connection?

Yes, the Skill fetches the latest guidelines from a remote GitHub raw URL before each review using WebFetch. Without network access it cannot retrieve the current rule set.

What output format does the UI audit produce?

Findings are output in a terse file:line format as specified by the fetched guidelines. Each entry points to the exact location of a rule violation in your code.