skills.rest
mhagrelius
mhagreliusCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Fetch Web Interface Guidelines and report UI compliance mismatches in file:line format.

2|Updated Jan 13, 2026
Search Tags:#design#ui#accessibility#review#guidelines#ux#web-standards
One-click install
npx skills add https://github.com/mhagrelius/dotfiles --skill web-design-guidelines-mhagrelius
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/mhagrelius/dotfiles/tree/main/.claude/skills/web-design-guidelines
Command: npx skills add https://github.com/mhagrelius/dotfiles --skill web-design-guidelines-mhagrelius

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams verify that UI and web interfaces comply with the Web Interface Guidelines, identifying accessibility, usability, and consistency gaps before release.

Core Features & Use Cases

  • Guideline compliance: Fetch the latest Web Interface Guidelines and apply them to your UI assets and code.
  • Automated review: Read the specified files or patterns, evaluate against all rules, and surface exact mismatches.
  • Use Case: Audit a landing page for accessible color contrast and navigational structure to ensure compliance across browsers.

Quick Start

Provide the files or pattern to review, and the skill will fetch the latest guidelines and provide a compliance 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 validate my UI code against web design guidelines and accessibility standards?▼

To validate UI code against web design guidelines, this skill fetches the latest published rules via WebFetch, reads your specified UI files, and reports accessibility and usability mismatches in a concise file:line format.

What is the best way to automatically review web interfaces for UX consistency?▼

Automated web interface review is done by reading specified files or patterns, evaluating them against fetched web standards, and surfacing exact compliance gaps before release.

Can I audit specific UI files for accessibility compliance without checking the whole project?▼

Yes, you can audit specific UI files by providing the target files or patterns for evaluation, and the skill will apply the latest web interface guidelines exclusively to those assets.

Does this web standards review tool require any dependencies to run?▼

No dependencies are required to run this web standards review tool, as it operates independently to fetch guidelines via WebFetch and analyze your local UI files.

How does fetching the latest web interface guidelines work during a UI review?▼

Fetching the latest web interface guidelines works by using WebFetch to pull the most recently published rules, ensuring your UI assets are evaluated against current accessibility and usability standards.

What format are UI compliance mismatches reported in?▼

UI compliance mismatches are reported in a concise file:line format, pinpointing exact locations in your code where accessibility, usability, or consistency gaps occur.

Related Skills

Explore More Design & Creative Skills→
junaid-ali-rukjunaid-ali-ruk

web-design-guidelines

Analyze UI code against Web Interface Guidelines and report compliance gaps.

Community
Basic
evolving-machines-labevolving-machines-lab
76

web-design-guidelines

Audit UI code for Web Interface Guidelines compliance and output findings in file:line format.

Official
Intermediate
LutimiLutimi

ckm:ui-styling

Integrate shadcn/ui, Radix primitives, and Tailwind CSS into React interfaces.

Community
Advanced
darthlinuxerdarthlinuxer

web-design-guidelines

Audit web frontend files against Web Interface Guidelines and output file:line findings.

Community
Intermediate