web-design-guidelines

Analyze UI code for compliance with Web Interface Guidelines.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams verify that UI code adheres to Web Interface Guidelines, reducing accessibility gaps and UX inconsistencies across projects.

Core Features & Use Cases

  • Guideline-driven review: automatically checks UI components, HTML semantics, color contrast, keyboard navigation, and responsive behavior against the latest guidelines.
  • Audit scenarios: suitable for UI reviews, accessibility audits, UX evaluations, or conformance checks before release.
  • Use Case: Imagine refining a landing page; this Skill flags accessibility gaps and suggests concrete improvements to meet guidelines.

Quick Start

Start a UI guideline review by providing the target files or patterns to assess, e.g., review the main web UI files for accessibility conformance.

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 accessibility and UX conformance?

To audit UI code for accessibility and UX conformance, provide target files or patterns for assessment. The skill reads the code, fetches the latest official Web Interface Guidelines, and reports findings on semantic HTML, color contrast, and keyboard navigation.

What is a UI guideline review and how does it work?

A UI guideline review automatically checks UI components against the latest official Web Interface Guidelines. It fetches current standards, reads target files, and evaluates HTML semantics, responsive behavior, and color contrast to identify accessibility gaps and UX inconsistencies.

Can I check HTML semantics and keyboard navigation across an entire project?

Yes, you can check HTML semantics and keyboard navigation across an entire project. The skill operates across codebases and project scopes, allowing you to provide target file patterns for comprehensive accessibility audits and UX evaluations.

Does this accessibility audit work for conformance checks before release?

Yes, this accessibility audit works for conformance checks before release. It is specifically designed for UI reviews, accessibility audits, and UX evaluations, flagging accessibility gaps and suggesting concrete improvements to ensure compliance.

What is the best way to find accessibility gaps in a landing page?

The best way to find accessibility gaps in a landing page is to provide its UI files for a guideline-driven review. The analysis automatically flags UX inconsistencies and suggests concrete improvements required to meet official Web Interface Guidelines.

Do I need external dependencies to perform a UX evaluation?

No, you do not need external dependencies to perform a UX evaluation. The skill fetches the latest guidelines directly from the official source and reads target files or patterns internally to report conformance findings.