web-design-guidelines

Audit UI files against the latest Web Interface Guidelines for accessibility compliance.

19|3|Updated Jan 13, 2026
One-click install
npx skills add https://github.com/changoo89/claude-pilot --skill web-design-guidelines-changoo89
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/changoo89/claude-pilot/tree/main/.claude/skills/external/vercel-agent-skills/web-design-guidelines
Command: npx skills add https://github.com/changoo89/claude-pilot --skill web-design-guidelines-changoo89

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps teams ensure user interfaces conform to established Web Interface Guidelines by fetching current rules and auditing code against them.

Core Features & Use Cases

  • Guideline-based UI review: fetch the latest rules and compare UI files for accessibility, consistency, and visual standards.
  • Audit across assets: applies to components, styles, and markup to catch deviations early.
  • Use Case: when shipping a UI module, run a guideline audit to identify and fix non-conformant elements.

Quick Start

Provide the UI files you want reviewed and let the assistant fetch the latest guidelines to perform a compliance audit.

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 compliance?

To audit UI code for accessibility compliance, provide your UI files to the assistant, which fetches the latest Web Interface Guidelines and checks components for non-conformities. It outputs findings in a file:line format for easy debugging.

What does a web interface guidelines check cover?

A web interface guidelines check covers UI components, accessibility aspects, and visual standards across web assets. It fetches current rules to catch deviations in markup and styles early before shipping a UI module.

Can I check UI components against the latest web design guidelines automatically?

Yes, you can check UI components automatically by providing your files to the assistant. It uses WebFetch to retrieve the latest rules and performs a compliance audit across your web assets.

How do I fix non-conformities found in a UI guidelines audit?

To fix non-conformities found in a UI guidelines audit, review the output findings reported in the file:line format. This pinpoints exact locations in your UI code where components or accessibility aspects deviate from the fetched rules.

Does this UI audit work with any web framework?

The UI audit works by checking UI files directly for compliance with Web Interface Guidelines. It evaluates components and accessibility aspects across web assets regardless of the specific framework used.