web-design-guidelines

Audit UI code against web interface guidelines and report violations.

77|3|Updated Mar 24, 2026

Search Tags:#ui #accessibility #frontend #audit #best-practices #design-review #web-guidelines

Ready to run

npx skills add https://github.com/FlorianBruniaux/starmapper --skill web-design-guidelines-florianbruniaux

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/FlorianBruniaux/starmapper/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/FlorianBruniaux/starmapper --skill web-design-guidelines-florianbruniaux

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps teams verify that UI code adheres to Web Interface Guidelines, identifying accessibility gaps, consistency issues, and design deviations early in the development process.

Core Features & Use Cases

Guideline conformance checks: validate UI against the latest web interface guidelines.
Accessibility verification: assess WCAG-alignment across components, pages, and patterns.
Use Case: when asked to review a UI or audit a site, surface violations and provide actionable fixes.

Quick Start

Provide the path or pattern to the UI files you want reviewed and run the skill to receive a concise conformance report.

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 frontend code for accessibility and UI design compliance?▼

To audit frontend code for accessibility and UI compliance, provide the file path or pattern to your UI files. The skill reads target files with Glob, fetches the latest web guidelines via WebFetch, and reports violations in a concise file:line format.

What is a web interface guidelines conformance check and when do I need it?▼

A web interface guidelines conformance check validates UI code against best practices to identify accessibility gaps and design deviations. You need it during frontend development and design reviews to catch consistency issues early before deployment.

Can I use this design review skill for both websites and mobile apps?▼

Yes, the design review skill is applicable across websites and apps. It audits UI code in frontend projects to assess WCAG alignment and surface violations, providing actionable fixes for various platforms.

How do I check WCAG compliance across my UI components?▼

To check WCAG compliance, run the audit skill against your UI component files. It fetches current guidelines via WebFetch, applies priority rules to the code, and outputs a conformance report detailing accessibility gaps.

What is the best way to automate web design reviews for frontend projects?▼

The best way to automate web design reviews is running an audit skill that fetches latest web interface guidelines and scans target files using Glob. It applies priority rules to identify deviations and generates a concise file:line conformance report.

Do I need to install any dependencies to run a UI accessibility audit?▼

No dependencies are required to run the UI accessibility audit. The skill operates standalone, using built-in WebFetch to retrieve guidelines and Glob to read your target frontend files for design and accessibility verification.