web-design-guidelines

Compare HTML, CSS, and JavaScript assets against Web Interface Guidelines.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Web interfaces often fall short of established Web Interface Guidelines and accessibility best practices, leading to usability gaps and inconsistent experiences across products.

Core Features & Use Cases

  • Fetch the latest Web Interface Guidelines from the official source.
  • Analyze HTML, CSS, and JavaScript assets for compliance with guidelines and accessibility criteria.
  • Output findings in a concise file:line format suitable for developer reviews and design critiques.
  • Use case: a UI team wants to validate a new page against guidelines before release.

Quick Start

Review the current project against the guidelines and return a concise, actionable 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 web project for accessibility and UI compliance gaps?

Automated UI compliance checks compare your HTML, CSS, and JavaScript assets against fresh Web Interface Guidelines, identifying accessibility gaps, visual inconsistencies, and UX pattern issues in a file:line format.

What is the best way to check if a web page meets current accessibility and usability guidelines before release?

Validating a page before release involves fetching the latest Web Interface Guidelines and applying checks to your HTML, CSS, and JavaScript to identify accessibility and visual consistency issues succinctly.

How do I review HTML and CSS assets for visual consistency and UX pattern issues?

Reviewing assets for visual consistency involves comparing your HTML, CSS, and JavaScript code against established Web Interface Guidelines to identify UX pattern deviations and accessibility gaps in a file:line format.

Can I use this Skill to get a concise report of accessibility issues for developer reviews?

Yes, the Skill outputs UI compliance and accessibility findings in a concise file:line format, making the reports directly suitable for developer reviews and design critiques.

Does the accessibility review process require fetching fresh web interface guidelines manually?

No, the Skill automatically fetches fresh Web Interface Guidelines from the official GitHub source before each review, ensuring your accessibility audit always uses the latest compliance criteria.