skills.rest
nshonda
nshondaCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Identify UI code violating Web Interface Guidelines and output actionable findings.

Updated Aug 23, 2026
Search Tags:#ui#accessibility#a11y#usability#review#guidelines#design-review
One-click install
npx skills add https://github.com/nshonda/workstation-setup --skill web-design-guidelines-nshonda
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/nshonda/workstation-setup/tree/main/claude/skills/web-design-guidelines
Command: npx skills add https://github.com/nshonda/workstation-setup --skill web-design-guidelines-nshonda

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".

Core Features & Use Cases

  • Automated guideline checks: Validate UI components against up-to-date Web Interface Guidelines to surface accessibility and usability issues.
  • Scope and targeting: Accepts file patterns or directories to focus the review on specific UI assets or entire projects.
  • Actionable outputs: Produce a concise report highlighting violations and suggested remediations suitable for design reviews.

Quick Start

Fetch the latest guidelines and run a review on the specified UI files or patterns to generate the compliance report.

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 UI code for accessibility and usability best practices?▼

To audit UI code for accessibility and usability, you can review your web projects against Web Interface Guidelines to identify violations and output actionable findings for remediation.

Can I check my component library for visual consistency and a11y compliance?▼

Yes, you can check component libraries for a11y compliance and visual consistency by applying guideline rules to targeted file sets, returning structured results suitable for design reviews.

What is the best way to review HTML, CSS, and JS files against web design guidelines?▼

The best way to review HTML, CSS, and JS files is to fetch the latest Web Interface Guidelines and apply those rules to your targeted directories to generate a structured compliance report.

Does this UI review work with existing linting and review workflows?▼

Yes, this UI review produces structured results compatible with downstream linting or review workflows, allowing you to integrate accessibility and usability checks into your existing pipeline.

How do I target specific UI assets during a design review?▼

You can target specific UI assets during a design review by providing file patterns or directories, allowing the guideline checks to focus only on the scoped components rather than the entire project.

Related Skills

Explore More Design & Creative Skills→
gonzalopozogonzalopozo
1

web-design-guidelines

Compare UI source files against the latest Web Interface Guidelines.

Community
Intermediate
mgiffordmgifford

Module Testing - Accessibility Impact Analysis

Analyze accessibility violations when toggling Drupal modules.

Community
Advanced
giosuetedeschi-specgiosuetedeschi-spec

web-design-guidelines

Evaluate web interface code for compliance with design and accessibility standards.

Community
Intermediate
abretonc7sabretonc7s

visual-testing

Capture screenshots before and after UI interactions to detect visual regressions.

Community
Intermediate