skills.rest
maedmatt
maedmattCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-design-guidelines

Analyze UI code for Web Interface Guidelines and accessibility compliance.

3|1|Updated Oct 8, 2025
Search Tags:#UI#audit#review#guidelines#design-review#web-accessibility#web-standards
One-click install
npx skills add https://github.com/maedmatt/dotfiles --skill web-design-guidelines-maedmatt
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/maedmatt/dotfiles/tree/main/shared/skills/web-design-guidelines
Command: npx skills add https://github.com/maedmatt/dotfiles --skill web-design-guidelines-maedmatt

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Review files to ensure UI code complies with Web Interface Guidelines and accessibility best practices, reducing usability risks and design debt.

Core Features & Use Cases

  • Guideline-driven UI review: Automatically fetch the latest Web Interface Guidelines and verify UI files against them.
  • Accessibility checks: Identify common accessibility issues and alignment with WCAG-based practices.
  • Use Case: When a designer asks to validate a UI, provide a focused report detailing guideline conformance.

Quick Start

Review UI files against the latest guidelines by providing the target file paths or patterns.

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 accessibility and design guideline compliance?▼

You can validate UI files by providing target file paths or patterns. The tool fetches the latest Web Interface Guidelines, reads the files, and generates a focused report detailing guideline conformance in a terse file:line format.

Does this UI review check for WCAG accessibility best practices?▼

Yes, the UI review checks for WCAG-based accessibility best practices. It analyzes UI code to identify common accessibility issues, ensuring alignment with web standards and reducing usability risks and design debt.

What is the best way to run a design review on user interface files?▼

The best way to run a design review is to provide target UI file paths or patterns. The tool automatically fetches current Web Interface Guidelines, analyzes the code, and reports conformance outcomes in a concise file:line format.

Can I use this to check web standards conformance across multiple projects?▼

You can use this tool for web standards conformance checks across multiple projects. It applies to audits of user interfaces across projects, executing accessibility checks, design reviews, and UX conformance validations.

What format does the UI audit report use for guideline violations?▼

The UI audit report uses a terse file:line format for guideline violations. This concise format pinpoints exact locations of accessibility issues and design guideline conformance failures within the reviewed code.

Related Skills

Explore More Design & Creative Skills→
JaimeJunrJaimeJunr
2

web-design-guidelines

Audit UI code against official Web Interface Guidelines and report violations in file:line format.

Community
Intermediate
msichtermanmsichterman

web-design-guidelines

Audit UI code against the latest Web Interface Guidelines and report findings in file:line format.

Community
Intermediate
BrennonTWilliamsBrennonTWilliams
7

ll-check-code

Execute linting, formatting, and type checking on project code.

Community
Basic
mustafazeydanimustafazeydani

accessibility

Automate web accessibility audits against WCAG 2.2 guidelines using Lighthouse.

Community
Advanced