skills.rest
lDuang
lDuangCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Audit UI code against Web Interface Guidelines and report file:line findings.

Updated Jan 17, 2026
Search Tags:#ui#accessibility#quality-assurance#ux#web-design#design-guidelines
One-click install
npx skills add https://github.com/lDuang/mcp-skill-registry --skill web-design-guidelines-lduang
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/lDuang/mcp-skill-registry/tree/main/skill/web-design-guidelines
Command: npx skills add https://github.com/lDuang/mcp-skill-registry --skill web-design-guidelines-lduang

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Review UI implementations to ensure compliance with Web Interface Guidelines, catching accessibility, usability, and consistency issues early in the development process.

Core Features & Use Cases

  • Automated UI audits against published guidelines
  • Accessibility and contrast checks across components
  • Use Case: a designer runs a site audit to surface WCAG and design-system deviations

Quick Start

Provide the UI files to review and ask the AI to audit against the guidelines.

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 frontend code for accessibility and UX consistency?▼

To audit UI code for accessibility and UX consistency, provide your frontend files for review. The tool fetches web design guidelines, reads the target files, applies the rules, and reports findings in a terse file:line format.

What is the best way to check design-system conformance across web assets?▼

Checking design-system conformance involves reviewing UI implementations against published web interface guidelines. This process catches accessibility, usability, and consistency deviations early in development.

Can I use this to run a site audit for WCAG and design-system deviations?▼

Yes, you can run a site audit to surface WCAG and design-system deviations. The tool applies automated UI audits against published guidelines to identify compliance issues across components.

How do I review UI implementations to ensure compliance with web interface guidelines?▼

Reviewing UI implementations requires fetching guidelines from a specified source and reading target files. The tool applies rules to the code and reports non-conformance using a terse file:line format.

Does this tool require any specific dependencies to perform UI accessibility checks?▼

No dependencies are required to perform UI accessibility checks. The tool operates independently to fetch guidelines, read target frontend files, and report findings directly.

What format does the tool use to report accessibility and contrast issues?▼

The tool reports accessibility and contrast check findings in a terse file:line format. This output quickly highlights exact locations of web interface guideline violations within the audited code.

Related Skills

Explore More Design & Creative Skills→
nextplus896nextplus896

web-design-guidelines

Evaluate UI files against Web Interface Guidelines and output file:line findings.

Community
Basic
ag47-ptag47-pt
1

web-design-guidelines

Review web interface code for accessibility, usability, and design guideline violations.

Community
Intermediate
kimjuyoung1127kimjuyoung1127

web-design-guidelines

Identify UI deviations from Web Interface Guidelines in code.

Community
Intermediate
ryan-nguyen-01ryan-nguyen-01
4

skill-ui-accessibility

Analyze web UI structure, semantics, and ARIA usage for accessibility gaps.

Community
Advanced