web-design-guidelines

Fetch official Web Interface Guidelines and report deviations in UI files.

286|38|Updated Jan 26, 2026
One-click install
npx skills add https://github.com/PageAI-Pro/ralph-loop --skill web-design-guidelines-pageai-pro
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/PageAI-Pro/ralph-loop/tree/main/.agent/skills/web-design-guidelines
Command: npx skills add https://github.com/PageAI-Pro/ralph-loop --skill web-design-guidelines-pageai-pro

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Helps teams ensure UI code complies with up-to-date Web Interface Guidelines by automatically fetching rules and validating files.

Core Features & Use Cases

  • Guideline fetch: Pulls fresh rules from the official guidelines source.
  • File review: Checks UI-related files (HTML/CSS/JS/design assets) against the rules.
  • Report & guidance: Outputs findings to guide fixes and improvements.
  • Use Case: When auditing a UI for accessibility or consistency, run a review to surface non-conforming patterns.

Quick Start

Provide the files you want reviewed and I will fetch the latest guidelines and evaluate them against the rules.

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 guidelines compliance?▼

To audit UI code for web design compliance, the tool fetches official rules at runtime and evaluates your HTML, CSS, and JavaScript files. It returns concise findings on non-conforming patterns to guide fixes.

What is the best way to check accessibility and UX consistency in web projects?▼

Checking accessibility and UX consistency involves validating UI files against fetched web interface guidelines. It surfaces non-conforming patterns and provides concise findings to guide fixes.

Can I review site-wide UI compliance across HTML, CSS, and JavaScript files?▼

Yes, you can review site-wide UI compliance across HTML, CSS, and JavaScript files. The evaluation applies to web projects and design assets, reporting deviations from fetched web interface guidelines.

Do I need to manually import web interface guidelines before running a UI lint?▼

No, you do not need to manually import web interface guidelines for a UI lint. The tool automatically fetches fresh rules from the official source at runtime to evaluate your files.

How are deviations from web interface guidelines reported after a file review?▼

Deviations from web interface guidelines are reported as concise findings. After evaluating your UI files, the tool outputs these findings to guide fixes and improvements for accessibility and compliance.