web-design-guidelines

Audit web interface code for design and accessibility compliance.

Updated Apr 12, 2026
One-click install
npx skills add https://github.com/elcokiin/peluqueria --skill web-design-guidelines-elcokiin
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/elcokiin/peluqueria/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/elcokiin/peluqueria --skill web-design-guidelines-elcokiin

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill addresses inconsistencies and accessibility gaps in web interfaces by automatically auditing your code against established industry design standards.

Core Features & Use Cases

  • Automated UI Auditing: Scans your codebase to ensure compliance with modern web interface guidelines.
  • Accessibility & UX Checks: Identifies potential usability issues and accessibility violations before they reach production.
  • Use Case: Use this tool during a code review to verify that your React components or CSS files adhere to best practices for layout, contrast, and semantic structure.

Quick Start

Ask the assistant to review the UI code in the current directory against the web interface 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 UI code for accessibility and web design compliance?

You can audit UI code for accessibility and web design compliance by scanning your React components or CSS files to identify usability issues and semantic structure violations before they reach production.

What does a web interface accessibility audit check for?

A web interface accessibility audit checks your code for layout inconsistencies, contrast issues, and semantic structure gaps to ensure high-quality user experiences and compliance with established design standards.

Can I use this tool to review React components and CSS files during a code review?

Yes, you can review React components and CSS files during a code review by asking the assistant to check the UI code in your current directory against modern web interface guidelines.

Do I need network access to check my codebase against web design guidelines?

Yes, you need network access to check your codebase against web design guidelines because the tool fetches the latest rule definitions from the Vercel Labs repository.

How do I start scanning my codebase for UX and accessibility violations?

To start scanning your codebase for UX and accessibility violations, ask the assistant to review the UI code in the current directory against the web interface guidelines to receive an automated compliance report.