skills.rest
shynlee04
shynlee04COMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Review UI code against web interface guidelines and report violations in file:line format.

Updated Jan 31, 2026
Search Tags:#design#ui#accessibility#usability#review#guidelines#web
One-click install
npx skills add https://github.com/shynlee04/idumb-plugin --skill web-design-guidelines-shynlee04
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/shynlee04/idumb-plugin/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/shynlee04/idumb-plugin --skill web-design-guidelines-shynlee04

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps teams verify that UI code and interfaces comply with Web Interface Guidelines, improving accessibility, consistency, and usability.

Core Features & Use Cases

  • Automated guideline checks against the latest web-interface-guidelines to ensure accessibility and design conformance.
  • Pattern-based reviews that apply to frontend components, pages, and design systems.
  • Use Case: Run a quick audit of the current project to identify color contrast, keyboard navigation, and semantic HTML issues.

Quick Start

Provide the UI files you want reviewed; the skill will fetch the latest guidelines and run the checks.

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 usability gaps?▼

To audit frontend code for accessibility gaps, provide your UI files for review. The skill fetches the latest web interface guidelines, parses target files, and reports violations in a concise file:line format.

What is automated UI guideline checking and how does it work for web apps?▼

Automated UI guideline checking reviews web apps by fetching official web interface guidelines and parsing your target files to detect accessibility, semantic HTML, and color contrast violations.

Can I use this to review a component library for design conformance?▼

Yes, you can review component libraries for design conformance. The skill applies pattern-based reviews against web interface guidelines to detect accessibility and usability gaps across frontend components.

What's the best way to run a quick accessibility audit on an existing web project?▼

The best way to run a quick accessibility audit is to provide your UI files. The skill automatically fetches the latest guidelines, parses the code, and outputs a checklist of violations in file:line format.

Do I need to install any dependencies to check web interface guidelines?▼

No dependencies are required to check web interface guidelines. The skill operates standalone to fetch the latest guidelines from the official source and parse your target files directly.

Related Skills

Explore More Design & Creative Skills→
nakafaainakafaai
78

web-design-guidelines

Analyze UI files against Web Interface Guidelines and report issues in file:line format.

Official
Basic
Patasse97Patasse97

a11y-audit

Identify WCAG 2.2 violations in frontend projects and generate remediation guidance.

Community
Advanced
VMRam95VMRam95

web-design-guidelines

Audit React and HTML code for WCAG accessibility and Vercel design compliance.

Community
Intermediate
shiro123444shiro123444
1

web-design-guidelines

Compare UI files against Web Interface Guidelines and report violations.

Community
Intermediate