web-design-guidelines

Audit UI code for Web Interface Guidelines compliance.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Helps teams verify that UI code adheres to Web Interface Guidelines, catching accessibility and interaction issues early.

Core Features & Use Cases

  • Accessibility checks (ARIA usage, keyboard navigation, semantic HTML)
  • Focus management and interaction patterns for consistent UX
  • Visual design conformance (typography, color contrast, layout)

Quick Start

Audit the target UI files for guideline conformance.

Frequently Asked Questions about web-design-guidelines

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I check my frontend code for web accessibility conformance?

Web accessibility conformance is verified by auditing UI code against established web interface guidelines, checking ARIA labels, keyboard navigation, form controls, and semantic HTML to catch interaction issues early.

What is a UI design review for web projects?

A UI design review applies fast checks to frontend code to verify UX consistency, visual design conformance, typography, color contrast, and layout alignment against web interface guidelines.

How do I audit ARIA usage and keyboard navigation in my UI?

You audit ARIA usage and keyboard navigation by applying automated checks to UI files, verifying focus management, interaction patterns, and semantic HTML structure against web interface guidelines.

Can I use this for visual design and typography audits across web projects?

Yes, visual design and typography audits are supported by checking UI code for conformance with web interface guidelines, verifying layout consistency, color contrast, and typographic standards across web projects.

Do I need any dependencies to review UI guidelines compliance?

No dependencies are required to review UI guidelines compliance; the audit operates directly on target UI files using internal reference guidelines to verify accessibility and interaction patterns.

What's the best way to catch accessibility issues early in frontend development?

The best way to catch accessibility issues early is running fast guideline conformance checks on UI code during development, verifying semantic HTML, ARIA labels, and keyboard navigation before release.