web-design-guidelines

Assesses UI files compliance with Web Interface Guidelines via WebFetch and reports findings by file:line.

1|Updated Dec 12, 2025
One-click install
npx skills add https://github.com/mohamed-g-shoaib/forge --skill web-design-guidelines-mohamed-g-shoaib
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/mohamed-g-shoaib/forge/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/mohamed-g-shoaib/forge --skill web-design-guidelines-mohamed-g-shoaib

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

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

Core Features & Use Cases

  • Guideline-driven reviews: automatically checks UI files against the latest Web Interface Guidelines.
  • Accessibility awareness: detects contrast, semantic, and navigational issues to improve usability.
  • Use Case: run checks on a new web app's component library to surface accessibility and consistency issues early.

Quick Start

Review my UI files against the latest Web Interface Guidelines to identify violations.

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 frontend code for web accessibility and UI guidelines compliance?

To audit frontend code for web accessibility and UI guidelines compliance, this Skill fetches the latest rules from a guidelines URL and reports violations in a file:line format. It automatically checks UI files against current Web Interface Guidelines.

How do I run a UX review on my component library to detect accessibility issues early?

Running a UX review on a component library to detect accessibility issues requires checking UI files against Web Interface Guidelines. This Skill fetches the latest rules and surfaces contrast, semantic, and navigational issues in file:line format.

Can I use this for front-end code audits across multiple projects?

Yes, you can use this for front-end code audits across multiple projects. It assesses UI files for compliance with Web Interface Guidelines, automatically fetching the latest rules to identify accessibility and consistency gaps.

What is the best way to ensure UI code complies with web standards?

The best way to ensure UI code complies with web standards is to run guideline-driven reviews that automatically check your files against the latest Web Interface Guidelines. This identifies accessibility and consistency gaps early.

Does this accessibility check require any dependencies or components to run?

No dependencies or components are required to run this accessibility check. The Skill uses WebFetch to retrieve the latest rules from the guidelines URL and applies them directly to your provided UI files.

Why does my web app have consistency gaps across different UI components?

Web apps have consistency gaps across different UI components when code does not adhere to Web Interface Guidelines. Running an audit fetches the latest rules to detect and report these violations in file:line format.