skills.rest
kunhai-88
kunhai-88COMMUNITY
Explore all skills by this author →
Website𝕏@KunhaiYGitHub

web-design-guidelines

Reviews web interface code for design and accessibility guideline compliance.

Updated Jan 25, 2026
Search Tags:#code review#accessibility#frontend#web design#guidelines#ui audit
One-click install
npx skills add https://github.com/kunhai-88/skills --skill web-design-guidelines-kunhai-88
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/kunhai-88/skills/tree/main/web-design-guidelines
Command: npx skills add https://github.com/kunhai-88/skills --skill web-design-guidelines-kunhai-88

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires web-fetch, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill automates the review of web UI code to ensure it adheres to established design and accessibility guidelines, catching potential issues before they impact user experience.

Core Features & Use Cases

  • Automated Compliance Checks: Scans code files against a comprehensive set of web interface best practices.
  • Accessibility Auditing: Identifies common accessibility violations within the UI code.
  • Use Case: A developer can use this skill to quickly check a new component's code against Vercel's UI guidelines, ensuring it meets accessibility standards and design principles.

Quick Start

Use the web-design-guidelines skill to audit the accessibility of the file 'src/components/Button.jsx'.

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 web interface code for accessibility and design guideline violations?▼

To audit web interface code, you can automatically scan specified UI files against established design and accessibility guidelines using rule-based analysis to identify compliance violations.

Can I check my frontend React component code against Vercel UI guidelines?▼

Yes, you can check frontend component code against external UI guidelines like Vercel's by fetching the reference documents and applying rule-based analysis to your specified code files.

What is the best way to automate UI code compliance checks for frontend development workflows?▼

The best way to automate UI code compliance checks is using a skill that fetches external guideline documents and applies rule-based analysis to front-end code files.

Do I need web-fetch to scan UI code against web standards?▼

Yes, web-fetch is required to retrieve external guideline documents needed to perform the rule-based analysis and compliance checks on your UI code.

What are the limitations of automated accessibility auditing for UI code?▼

Automated accessibility auditing limitations include relying on fetched external guideline documents and applying rule-based analysis, which may not catch all complex, context-specific user experience issues.

When do I need to run a UI code audit for web design compliance?▼

You need to run a UI code audit when adding new components to front-end development workflows, ensuring they meet accessibility standards and established design principles before impacting user experience.

Related Skills

Explore More Design & Creative Skills→
remcostoetenremcostoeten
14

web-design-guidelines

Audit web interface code against design and accessibility standards.

Community
Intermediate
dthompsonfldthompsonfl

web-design-guidelines

Audit HTML, CSS, and ARIA against Web Interface Guidelines and report violations.

Community
Intermediate
TrimudTrimud

web-design-guidelines

Compare frontend code against Web Interface Guidelines and report violations.

Community
Intermediate
alexzuoshalexzuosh

web-design-guidelines

Audit UI code against Web Interface Guidelines for compliance and accessibility.

Community
Basic