skills.rest
cmetech
cmetechCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-design-guidelines

Audit UI code against Web Interface Guidelines for accessibility and design non-conformities.

Updated May 25, 2026
Search Tags:#accessibility#a11y#audit#ui-design#lint#design-review#web-guidelines
One-click install
npx skills add https://github.com/cmetech/otto-cli --skill web-design-guidelines-cmetech
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/cmetech/otto-cli/tree/main/src/resources/skills/web-design-guidelines
Command: npx skills add https://github.com/cmetech/otto-cli --skill web-design-guidelines-cmetech

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This tool helps teams verify that their UI code adheres to the Web Interface Guidelines, catching accessibility gaps, contrast issues, and interaction design deficiencies early in development.

Core Features & Use Cases

  • Guideline-driven reviews: Fetch the latest rules from the official Web Interface Guidelines source and apply them to your project.
  • File-pattern evaluation: Read specified files or glob patterns to identify non-conforming UI elements.
  • Actionable reports: Output findings in a terse file:line format suitable for quick triage and remediation.
  • Use Case: A design lead runs a weekly audit of the project’s UI files to ensure accessibility and consistency across pages.

Quick Start

Review the UI files using the latest guidelines to identify accessibility and design violations.

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 UI code for accessibility and design non-conformities?▼

To audit UI code for accessibility issues, this Skill fetches the latest Web Interface Guidelines and applies them to your specified files, outputting contrast and markup violations in a file:line format for quick triage.

What is a UI design lint review and how does it work for web projects?▼

A UI design lint review verifies markup, contrast, and interaction patterns against current guidelines. This Skill reads target files or glob patterns in your UI repository and evaluates them against fetched rules to surface design deficiencies.

Can I run an accessibility audit on specific files using glob patterns?▼

Yes, you can run an accessibility audit on specific files by providing file paths or glob patterns. The Skill reads the specified targets in your web project, applies all guideline rules, and generates a report of non-conforming UI elements.

Does this accessibility audit tool work without any external dependencies?▼

Yes, this accessibility audit tool operates without external dependencies. It independently fetches the latest guidelines from the source URL, reads your target UI files, applies the rules, and outputs findings directly.

What's the best way to review UI files for accessibility gaps early in development?▼

The best way to review UI files for accessibility gaps early is running a guideline-driven audit. This tool applies current Web Interface Guidelines to your markup and interaction patterns, catching contrast and design issues before release.

Why might an accessibility audit report missing interaction design deficiencies?▼

An accessibility audit reports missing interaction design deficiencies because it evaluates UI code against comprehensive Web Interface Guidelines, specifically targeting markup, contrast, and interaction patterns to ensure consistency across pages.

Related Skills

Explore More Design & Creative Skills→
BEIRUXBEIRUX

web-design-guidelines

Review UI code against Web Interface Guidelines and output file:line findings.

Official
Intermediate
ChristineThamChristineTham

web-design-guidelines

Identify UI accessibility and design guideline violations in project files.

Community
Intermediate
I2olanDI2olanD

accessibility-design

Implements WCAG 2.1 accessibility standards in web interfaces.

Community
Basic
zeronx798zeronx798

dogfood

Navigate web pages and interact with DOM elements to detect functional, visual, accessibility issues via browser snapshots and console error monitoring, producing structured bug reports.

Community
Advanced