web-design-guidelines

Validate UI code against Web Interface Guidelines for accessibility and usability gaps.

105|12|Updated Feb 7, 2026
One-click install
npx skills add https://github.com/tmcfarlane/oh-my-cursor --skill web-design-guidelines-tmcfarlane
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/tmcfarlane/oh-my-cursor/tree/main/skills/web-design-guidelines
Command: npx skills add https://github.com/tmcfarlane/oh-my-cursor --skill web-design-guidelines-tmcfarlane

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Review UI code to ensure compliance with Web Interface Guidelines, helping teams catch accessibility, usability, and design gaps before deployment.

Core Features & Use Cases

  • Fetch the latest Web Interface Guidelines from a remote source and apply them to your UI files.
  • Read target files or patterns, then assess accessibility, contrast, semantics, and responsive behavior.
  • Use case: audit a web page or component for WCAG-alignment, semantic HTML, and consistent design tokens, and output a concise report.

Quick Start

Provide the UI files or a file pattern to review, and the skill will fetch the latest guidelines and return 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 audit my UI code for accessibility and contrast issues?

To audit UI code for accessibility and contrast issues, provide your UI files or file patterns for review. The tool fetches the latest Web Interface Guidelines, evaluates semantic HTML, design consistency, and contrast, then returns a concise compliance report.

What is a UI code review against web design guidelines?

A UI code review against web design guidelines is a validation process that checks components, pages, or entire sites for WCAG alignment, semantics, and responsive behavior. It fetches current rules and reports accessibility and usability gaps in a terse file:line format.

Can I check an entire site for design consistency and semantic HTML?

Yes, you can check an entire site for design consistency and semantic HTML. The review process applies to individual components, pages, or full sites, reading target files to assess design tokens and semantics before deployment.

How do I validate a web page for WCAG compliance before deployment?

To validate a web page for WCAG compliance before deployment, submit the target file or pattern for review. The tool applies the latest Web Interface Guidelines to identify accessibility, contrast, and usability gaps, outputting findings in a concise file:line format.

Does the UI review process work with individual components or only full pages?

The UI review process works with both individual components and full pages. It applies rules across all scopes, reading target files to assess accessibility, semantics, contrast, and responsive behavior regardless of the file size.

What format does the accessibility and usability report use?

The accessibility and usability report uses a terse file:line format. After reading target files and applying all guideline rules, the tool outputs concise findings that pinpoint exact locations of design and accessibility gaps.