skills.rest
eryckassis
eryckassisCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-design-guidelines

Compare project files against Web Interface Guidelines to identify UI compliance gaps.

Updated Aug 27, 2026
Search Tags:#ui#accessibility#review#web#design-guidelines#conformance
One-click install
npx skills add https://github.com/eryckassis/Dior-Luxury-Boutique-Saas --skill web-design-guidelines-eryckassis
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/eryckassis/Dior-Luxury-Boutique-Saas/tree/main/.claude/web-design-guidelines
Command: npx skills add https://github.com/eryckassis/Dior-Luxury-Boutique-Saas --skill web-design-guidelines-eryckassis

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Review UI code to ensure compliance with Web Interface Guidelines, helping teams catch accessibility, consistency, and usability issues early.

Core Features & Use Cases

  • Guideline conformance checks: verify UI components against latest guidelines for accessibility (contrast, keyboard focus, aria attributes) and design consistency.
  • Codebase-wide scanning: apply checks across React, HTML, CSS, and design tokens to identify deviations in multiple pages or components.
  • Use Case: When auditing a new product page, run checks to surface accessibility gaps and visual inconsistencies before release.

Quick Start

Run a UI review by pointing this skill at your project files and providing the path or pattern to analyze.

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 web project codebase for UI design and accessibility conformance?▼

To audit UI for design and accessibility, you can scan your web project codebase by specifying file paths or patterns. The review checks React, HTML, CSS, and design tokens against fetched Web Interface Guidelines to surface compliance gaps.

Can I check my React components for visual guideline conformance and keyboard focus issues?▼

Yes, visual guideline conformance checks analyze React components to verify keyboard focus, aria attributes, and color contrast. This ensures UI consistency and accessibility compliance across your entire codebase.

What is the best way to perform an accessibility audit on web design tokens and CSS?▼

The best way to perform an accessibility audit on web design tokens and CSS is running a codebase-wide scan. It compares your styling files against latest Web Interface Guidelines to identify visual inconsistencies and accessibility deviations.

Does this UI review tool require any specific dependencies or environment setup?▼

No specific dependencies or environment setup are required to run this UI review. The skill fetches the latest remote guidelines independently and analyzes your specified project files without needing external component installations.

Why does my UI consistency review output line-oriented findings instead of a visual report?▼

Your UI consistency review outputs line-oriented findings to provide concise, actionable results suitable for direct review. This format highlights specific codebase deviations and compliance gaps efficiently without generating a visual report.

When do I need to run a UX consistency check against Web Interface Guidelines?▼

You need to run a UX consistency check when auditing a new product page before release. This catches accessibility gaps, aria attribute issues, and visual inconsistencies early by comparing project files against latest guidelines.

Related Skills

Explore More Design & Creative Skills→
hybrid-npmhybrid-npm
17

web-design-guidelines

Analyze HTML, CSS, and ARIA code against Web Interface Guidelines.

Official
Intermediate
gaiastudio-aigaiastudio-ai
2

gaia-review-a11y

Identify WCAG 2.1 accessibility issues and generate a Markdown findings report.

Official
Advanced
1479089714790897
7

kwp-design-design-system

Audit component libraries for naming inconsistencies and missing documentation.

Community
Intermediate
vuminhieuvuminhieu

web-design-guidelines

Audit UI code against Web Interface Guidelines and report file:line findings.

Community
Intermediate