web-design-guidelines

Audit web UI code against current Web Interface Guidelines for accessibility and usability issues.

Updated May 3, 2026
One-click install
npx skills add https://github.com/wanyusheng63-alt/vocab-learn --skill web-design-guidelines-wanyusheng63-alt
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/wanyusheng63-alt/vocab-learn/tree/main/.codebuddy/skills/web-design-guidelines
Command: npx skills add https://github.com/wanyusheng63-alt/vocab-learn --skill web-design-guidelines-wanyusheng63-alt

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you verify that your web UI code aligns with the latest Web Interface Guidelines, catching accessibility, usability, and consistency issues early in the design cycle.

Core Features & Use Cases

  • Fetch the latest guidelines from the official source and apply them to your UI codebase.
  • Read and analyze UI files, components, and patterns to detect deviations from best practices.
  • Produce concise, actionable findings suitable for design reviews, QA, and accessibility audits.

Quick Start

Provide the UI files or patterns to review, and I will start the audit against the latest 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 audit my web UI code for accessibility and usability issues?

To audit web UI code for accessibility and usability issues, provide your UI files or patterns to the Skill. It fetches the latest Web Interface Guidelines, analyzes your codebase, and reports deviations in a concise file:line format.

Can I run an accessibility audit on a component library across different frameworks?

Yes, you can run an accessibility audit on a component library across different frameworks. The Skill applies guideline rules to UI codebases, component libraries, pages, and responsive layouts regardless of the specific framework used.

What is the best way to check if a responsive layout follows current web interface guidelines?

Checking if a responsive layout follows current web interface guidelines involves fetching the latest official rules and applying them to your layout files. The Skill reads your specified UI patterns and detects deviations from best practices.

How do I review UI files for design consistency and accessibility compliance?

Reviewing UI files for design consistency and accessibility compliance requires applying up-to-date Web Interface Guidelines to your codebase. The Skill analyzes the specified files, applies all rules, and produces concise, actionable findings for design reviews.

Does this web design audit work for both automated checks and manual reviews?

Yes, this web design audit works for both automated checks and manual reviews. It reads and analyzes UI files and patterns to detect deviations from best practices, producing actionable findings suitable for QA and accessibility audits.

What format do the accessibility audit findings use to report issues?

The accessibility audit findings use a concise file:line format to report issues. This format identifies exactly where deviations from the Web Interface Guidelines occur in your UI codebase, making the results actionable for design reviews.