web-design-guidelines

Review HTML, CSS, and JavaScript UI code against Web Interface Guidelines.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/PaulCrossland1/claude-code-skills --skill web-design-guidelines-paulcrossland1
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/PaulCrossland1/claude-code-skills/tree/main/web-design-guidelines
Command: npx skills add https://github.com/PaulCrossland1/claude-code-skills --skill web-design-guidelines-paulcrossland1

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams ensure UI code adheres to Web Interface Guidelines, improving accessibility, usability, and visual consistency across web projects.

Core Features & Use Cases

  • Guideline-driven review: Assess UI files (HTML/CSS/JS) against the latest web interface guidelines.
  • Accessibility focus: Identify common accessibility issues and actionable fixes.
  • Use Case: For a new landing page, run the review to surface violations and recommended improvements, then apply fixes.

Quick Start

Provide the UI files or a pattern (e.g., src/components/** or index.html). The Skill fetches the latest guidelines, analyzes the specified files, and outputs findings in the requested format.

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 issues?

To audit frontend code for accessibility issues, provide your HTML, CSS, or JavaScript files and the review analyzes them against web interface guidelines, outputting findings in a file:line format with actionable fixes.

What is a UI code review against web guidelines?

A UI code review against web guidelines is an assessment of frontend files to identify semantic problems, accessibility violations, and design inconsistencies, ensuring usability and visual consistency across web projects.

Can I review a specific UI component pattern instead of a whole project?

Yes, you can review a specific UI component pattern by providing a path pattern like src/components/** or a single file such as index.html, and the review will apply all rules to those specified files.

How do I ensure my web design guidelines are up to date during a review?

To ensure web design guidelines are up to date during a review, the process automatically fetches the latest guidelines from the source before analyzing your specified UI files, applying the most current rules.

What format are accessibility audit findings reported in?

Accessibility audit findings are reported in a file:line format, detailing specific violations and recommended improvements directly mapped to your HTML, CSS, and JavaScript codebase for easy reference.