web-design-guidelines

Fetch web interface guidelines and audit UI files for compliance.

1|Updated Apr 11, 2026
One-click install
npx skills add https://github.com/shige1014-dev/backup-OpenMontage --skill web-design-guidelines-shige1014-dev
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/shige1014-dev/backup-OpenMontage/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/shige1014-dev/backup-OpenMontage --skill web-design-guidelines-shige1014-dev

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Review UI code for Web Interface Guidelines compliance to improve accessibility, consistency, and usability across projects.

Core Features & Use Cases

  • Automated guideline fetch and rule application to UI files
  • Output findings in file:line format for easy integration into code reviews
  • Use Case: Audit a web app against the latest design and accessibility guidelines to surface actionable issues

Quick Start

Provide the UI files you want reviewed, or a pattern to select them, and the skill will fetch the latest guidelines and start the 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 my UI code against web accessibility guidelines?▼

To audit UI code for accessibility, fetch the latest web interface guidelines from a specified URL and evaluate your target UI files against those rules, outputting findings in a terse file:line format for direct integration into design reviews.

Can I review my frontend project for usability and a11y compliance automatically?▼

You can review frontend projects for a11y compliance by providing UI files or selection patterns; the system fetches up-to-date web guidelines at runtime via a WebFetch mechanism and applies all fetched rules to surface actionable usability issues.

What is the best way to integrate automated design reviews into my web app workflow?▼

The best way to integrate automated design reviews is to output accessibility and quality findings in a file:line format, allowing developers to directly pinpoint and resolve web guideline violations within their existing code review processes.

Do I need to provide specific files to check frontend usability issues?▼

Yes, you need to provide the UI files you want reviewed or a pattern to select them so the system can read the targets and evaluate them against all fetched web guidelines to identify specific usability and accessibility issues.

How does fetching up-to-date web guidelines work during a code review?▼

Fetching up-to-date web guidelines works by using a WebFetch mechanism to retrieve the latest rules from a specified source URL at runtime, ensuring the accessibility and quality audit checks your UI code against current standards.

What limitations exist when evaluating UI patterns for web interface guidelines?▼

Evaluating UI patterns for web interface guidelines requires a valid guidelines source URL to fetch rules at runtime, and the output is limited to terse file:line findings, meaning you must manually interpret and apply the accessibility fixes.