web-design-guidelines

Review UI code against Web Interface Guidelines and report findings in file:line format.

Updated Jan 24, 2026
One-click install
npx skills add https://github.com/amano--/call-center --skill web-design-guidelines-amano
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/amano--/call-center/tree/main/.agent/skills/design-system/web-design-guidelines
Command: npx skills add https://github.com/amano--/call-center --skill web-design-guidelines-amano

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps ensure that user interface code adheres to established Web Interface Guidelines, improving consistency, accessibility, and overall user experience.

Core Features & Use Cases

  • Automated Compliance Checks: Fetches the latest guidelines and checks specified files against them.
  • Detailed Findings: Reports issues in a concise file:line format.
  • Use Case: A developer can use this skill to audit a new component's UI code against best practices before it's merged into the main project.

Quick Start

Review the file 'src/components/Button.js' for compliance with 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 UI code for web design guideline compliance?

To audit UI code for web design guideline compliance, you can review specified files against fetched Web Interface Guidelines. The tool identifies non-compliant elements and outputs findings in a concise file:line format for quick resolution.

What is a UI design audit and how does it identify accessibility issues?

A UI design audit checks user interface code against established web guidelines to ensure accessibility and UX best practices. It fetches the latest compliance rules, applies them to your files, and reports non-compliant elements in a terse file:line format.

How do I check my web components for accessibility and UX best practices before merging?

You can check web components for accessibility and UX best practices before merging by running an automated compliance check. The review fetches current web guidelines, evaluates your specified UI code, and outputs any non-compliant findings.

Can I review specific UI files for code compliance without checking the entire project?

Yes, you can review specific UI files for code compliance without checking the entire project. You simply specify the target file, such as a component file, and the review applies the latest Web Interface Guidelines strictly to that file.

What format does the UI review use to report non-compliant elements?

The UI review reports non-compliant elements in a terse file:line format. This concise output style pinpoints exactly where your UI code violates Web Interface Guidelines, ensuring consistency and fast resolution.

Do I need to manually update web guidelines to run a design audit?

No, you do not need to manually update web guidelines to run a design audit. The review process automatically fetches the latest Web Interface Guidelines and applies them to your specified files to check for compliance.