web-design-guidelines

Compare UI files against the latest Web Interface Guidelines and report non-compliance.

Updated Feb 27, 2026
One-click install
npx skills add https://github.com/nearbycoder/soloagent --skill web-design-guidelines-nearbycoder
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/nearbycoder/soloagent/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/nearbycoder/soloagent --skill web-design-guidelines-nearbycoder

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams ensure UI code complies with authoritative Web Interface Guidelines, reducing accessibility and usability gaps across projects.

Core Features & Use Cases

  • Fetch the latest Web Interface Guidelines and load them into the review context.
  • Analyze target UI files or patterns against all guideline rules and report non-compliance.
  • Generate concise, actionable findings suitable for design reviews and code fixes.
  • Use Case: You want to verify that a new component adheres to accessibility and usability standards before merging.

Quick Start

Provide the target UI files or patterns and run a guidelines-based check against the latest 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 audit frontend UI code for accessibility and usability non-compliance?

Web design audits identify UI and accessibility non-compliance by comparing frontend code against authoritative Web Interface Guidelines. This process fetches rules from a source URL, reads target files, and outputs findings in a terse file:line format.

What is a web design guidelines audit and how does it work?

A web design guidelines audit compares frontend UI files against the latest Web Interface Guidelines to identify accessibility and usability gaps. It fetches rules from a source URL, reads target files, applies all rules, and outputs concise non-compliance findings.

Can I check a single component for accessibility compliance before merging?

Yes, you can verify a single component for accessibility compliance before merging by running a guidelines-based check. Provide the target UI file or pattern and the audit will compare it against the latest Web Interface Guidelines to report non-compliance findings.

How do I check web components for a11y compliance against authoritative guidelines?

To check web components for a11y compliance, provide the target files or patterns to a guidelines-based review. The audit applies all Web Interface Guidelines rules to your UI code and reports non-compliance findings in a concise file:line format.

Does this web design review work with any frontend UI code or specific frameworks?

This web design review is applicable to frontend UI code, components, and pages across web projects. It analyzes target UI files or patterns against Web Interface Guidelines rules without being limited to a specific framework.

What format do accessibility audit findings follow when reviewing UI files?

Accessibility audit findings follow a terse file:line format when reviewing UI files. This concise output ensures non-compliance findings against the Web Interface Guidelines are directly actionable for design reviews and code fixes.