web-design-guidelines

Review UI code for Web Interface Guidelines compliance.

7.8k|770|Updated Mar 11, 2026
One-click install
npx skills add https://github.com/gsd-build/gsd-2 --skill web-design-guidelines-gsd-build
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/gsd-build/gsd-2/tree/main/src/resources/skills/web-design-guidelines
Command: npx skills add https://github.com/gsd-build/gsd-2 --skill web-design-guidelines-gsd-build

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Quickly assess code against Web Interface Guidelines to ensure accessible, consistent, and high-quality UI.

Core Features & Use Cases

  • Fetch the latest Web Interface Guidelines and compare against project files.
  • Evaluate UI components for accessibility, layout, color contrast, and semantics.
  • Use Case: When asked to review a UI or audit a site for best practices, run a full guideline compliance check.

Quick Start

Provide the target UI files or patterns to review and let the system apply the guidelines automatically.

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 front-end code for web design guidelines compliance?

To audit front-end code for web design guidelines compliance, provide the target UI files to review. The system fetches the latest guidelines, applies the rules automatically, and outputs findings on accessibility, layout, and semantics.

What is a UI code review for web interface guidelines?

A UI code review for web interface guidelines evaluates your front-end codebase against established standards. It assesses accessibility, layout, color contrast, and semantics to ensure consistent and high-quality UI across projects.

How do I check my UI components for accessibility and color contrast?

To check UI components for accessibility and color contrast, run a full guideline compliance check on your target files. The review evaluates components automatically and reports findings in a prescribed format.

Can I use this design review tool for any front-end codebase?

Yes, you can use this design review tool for any front-end codebase. It applies to design validation tasks across projects, fetching specified guidelines and reading target files to ensure adherence without requiring specific frameworks.

When should I run a web guidelines compliance check on my project?

You should run a web guidelines compliance check when you need to audit a site for best practices or validate UI design. It quickly assesses code against web interface guidelines to ensure accessible and consistent UI.

Do I need to manually provide web interface guidelines for the code review?

No, you do not need to manually provide web interface guidelines for the code review. The system automatically fetches the latest guidelines from the specified source to compare against your project files.