skills.rest
ShenQingchuan
ShenQingchuanCOMMUNITY
Explore all skills by this author →
Website𝕏@ShenQingchuanGitHub

web-design-guidelines

Audit HTML and CSS UI files against Web Interface Guidelines.

5|Updated Jan 29, 2026
Search Tags:#accessibility#frontend#UI#audit#code-review#web-design-guidelines
One-click install
npx skills add https://github.com/ShenQingchuan/val.dokduk --skill web-design-guidelines-shenqingchuan
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/ShenQingchuan/val.dokduk/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/ShenQingchuan/val.dokduk --skill web-design-guidelines-shenqingchuan

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams ensure their UI codebase adheres to established Web Interface Guidelines, improving accessibility, consistency, and overall usability across products.

Core Features & Use Cases

  • Guideline adherence checks: Compare UI files against the latest Web Interface Guidelines to surface conformance gaps.
  • File-based reviews: Scan specified HTML/CSS/JS/TS files or patterns to target areas needing improvement.
  • Use Case: Run a UI audit on a new feature to identify accessibility issues and visual inconsistencies before release.

Quick Start

Use the web-design-guidelines skill on your project to start an automated UI guideline review.

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 project for UI design guideline compliance?▼

Accessibility audits check your HTML and CSS codebase against Web Interface Guidelines to identify conformance gaps. This Skill reads specified UI files and outputs findings in a file:line format to surface accessibility issues.

Can I run an accessibility audit on component-based framework files?▼

Yes, you can run accessibility audits on component-based frameworks. The Skill scans HTML, CSS, JS, and TS files to check rules from a centralized guideline source and outputs accessibility issues in a file:line format.

What is the best way to check accessibility issues before a feature release?▼

The best way to check accessibility issues before release is an automated UI audit. This Skill scans target files to surface conformance gaps and visual inconsistencies against Web Interface Guidelines, improving overall usability.

Does this UI guideline audit work with plain HTML and CSS files?▼

Yes, this UI guideline audit works with plain HTML and CSS files. It reads user-specified target files across codebases to check rules from a centralized guideline source and outputs findings in a file:line format.

How do I identify visual inconsistencies in my UI codebase?▼

You identify visual inconsistencies by scanning your UI files against Web Interface Guidelines. This Skill reads user-specified HTML and CSS files and outputs conformance gaps in a file:line format to pinpoint visual inconsistencies.

What format does the UI code review output for accessibility findings?▼

The UI code review outputs accessibility findings in a file:line format. This allows you to quickly locate and fix conformance gaps, accessibility issues, and visual inconsistencies across your HTML and CSS codebase.

Related Skills

Explore More Design & Creative Skills→
PheonixCodderPheonixCodder

web-design-guidelines

Evaluates UI code against Web Interface Guidelines for accessibility and consistency.

Community
Intermediate
hoanghd218hoanghd218

web-design-guidelines

Identify UI compliance gaps in code against the Web Interface Guidelines.

Community
Intermediate
Max-LooMax-Loo
2

web-design-guidelines

Check web project files against current Web Interface Guidelines.

Community
Intermediate
Insik-HanInsik-Han
16

web-design-guidelines

Audit React, HTML, CSS, and JavaScript files against Web Interface Guidelines.

Community
Intermediate