skills.rest
ev3rlit
ev3rlitCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Audit UI code against fetched Web Interface Guidelines and output file:line findings.

Updated Apr 2, 2026
Search Tags:#ui#accessibility#usability#review#guidelines#code-review#web-design
One-click install
npx skills add https://github.com/ev3rlit/magam-canonical-archive --skill web-design-guidelines-ev3rlit
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/ev3rlit/magam-canonical-archive/tree/main/.claude/skills/web-design-guidelines
Command: npx skills add https://github.com/ev3rlit/magam-canonical-archive --skill web-design-guidelines-ev3rlit

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provides automated review of UI code to ensure alignment with Web Interface Guidelines, improving accessibility and consistency across web interfaces.

Core Features & Use Cases

  • Fetch fresh guidelines from https://raw.githubusercontent.com/vercel-labs/web-interface-guidelines/main/command.md and compare target UI files against them.
  • Scan HTML, CSS, and JS code, components, and design tokens for compliance with accessibility, usability, and design standards.
  • Use Case: Validate a landing page for color contrast, semantic structure, keyboard navigation, and responsive behavior.

Quick Start

Provide the UI files you want reviewed and I will fetch the latest guidelines and run the checks.

Frequently Asked Questions about web-design-guidelines

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

FAQPage Schema
How do I audit UI code for accessibility and web design compliance?▼

You can audit UI code for accessibility by fetching the latest Web Interface Guidelines and comparing target files against them to validate conformance and output findings in a file:line format.

What is automated UI code review for web interfaces?▼

Automated UI code review scans HTML, CSS, and JS components against fetched web design standards to identify accessibility, usability, and consistency issues in your codebase.

Can I use this to check design system components and design tokens?▼

Yes, you can validate design system component libraries and design tokens by specifying the relevant files for review against the fetched Web Interface Guidelines.

How do I review a landing page for color contrast and keyboard navigation?▼

Provide your landing page files for review to scan for color contrast, semantic structure, keyboard navigation, and responsive behavior against the latest web usability guidelines.

Do I need to install dependencies to run a web interface guidelines audit?▼

No dependencies are required to run the web interface guidelines audit. You only need to provide the UI files you want reviewed, and the guidelines are fetched automatically.

What's the best way to keep UI accessibility reviews current with changing standards?▼

Fetch fresh guidelines directly from the remote source each time you audit your UI code to ensure your accessibility and usability reviews always validate against the latest standards.

Related Skills

Explore More Design & Creative Skills→
nirukk52nirukk52
1

web-design-guidelines

Validate HTML, CSS, and JS files against Web Interface Guidelines.

Community
Basic
misty-stepmisty-step
13

web-design-guidelines

Audit UI files against Web Interface Guidelines for accessibility and UX conformance.

Official
Intermediate
srivtxsrivtx

code-review

Automate code review for local changes and GitHub pull requests.

Community
Advanced
masumi-networkmasumi-network
11

web-design-guidelines

Review UI code against web interface guidelines for accessibility and design consistency.

Official
Intermediate