skills.rest
chacha95
chacha95COMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Review UI code against Web Interface Guidelines for accessibility and UX.

Updated Aug 23, 2026
Search Tags:#code quality#accessibility#ui review#ux audit#web guidelines
One-click install
npx skills add https://github.com/chacha95/advanced-harness --skill web-design-guidelines-chacha95
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/chacha95/advanced-harness/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/chacha95/advanced-harness --skill web-design-guidelines-chacha95

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill addresses the challenge of maintaining consistent and high-quality user interfaces by automatically checking code against established web design best practices and accessibility standards.

Core Features & Use Cases

  • Automated Code Review: Scans UI code files for adherence to Vercel's Web Interface Guidelines.
  • Accessibility Auditing: Identifies potential accessibility issues within the code.
  • UX Best Practice Verification: Checks for common UX pitfalls and areas for improvement.
  • Use Case: A developer can submit a new component's code and have this Skill instantly report any deviations from the company's design system or accessibility requirements.

Quick Start

Use the web-design-guidelines skill to review the accessibility and UX of the files in the 'src/components' directory.

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 front-end code for accessibility compliance?▼

This Skill automates UI code review by fetching external web interface guideline documents and applying rule-based checks to your specified front-end code files to report accessibility and UX deviations.

What is the best way to check UI components against web design guidelines?▼

Checking UI components against web design guidelines involves fetching external documents and applying rule-based checks to your front-end code to verify adherence to design system rules and best practices.

Can I use this to verify UX best practices in my src directory?▼

You can verify UX best practices in your src directory by applying rule-based checks to your front-end code files to identify common UX pitfalls and areas for improvement.

Do I need to manually provide web interface guidelines for the review?▼

You do not need to manually provide web interface guidelines because the Skill automatically fetches external guideline documents to perform the rule-based accessibility and UX checks on your code.

Are there limitations to automated accessibility auditing for code files?▼

A limitation of automated accessibility auditing is that it applies rule-based checks specifically to front-end code files, meaning it requires fetching external guidelines and may not catch complex runtime UX issues without static code to analyze.

Related Skills

Explore More Design & Creative Skills→
remcostoetenremcostoeten
14

web-design-guidelines

Audit web interface code against design and accessibility standards.

Community
Intermediate
ankitsharma495ankitsharma495

web-design-guidelines

Review UI code against Web Interface Guidelines for accessibility compliance.

Community
Intermediate
EwallywEwallyw

plankton-code-quality

Run linters and formatters on every file edit via Claude Code.

Community
Advanced
ivalsarajivalsaraj
7

highlight

Highlight matching DOM elements with a CSS outline and clear them.

Community
Basic