web-design-guidelines

Compare UI code against Web Interface Guidelines and report file:line violations.

Updated Jan 5, 2026
One-click install
npx skills add https://github.com/d3ming/dot-agents --skill web-design-guidelines-d3ming
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/d3ming/dot-agents/tree/main/master/skills-archive/web-design-guidelines
Command: npx skills add https://github.com/d3ming/dot-agents --skill web-design-guidelines-d3ming

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Web projects often fail to satisfy consistent design and accessibility guidelines across codebases, leading to inconsistent UX and review overhead.

Core Features & Use Cases

  • Guideline compliance checks: automates verification of UI components against a centralized design guideline.
  • Codebase review: scans frontend code, markup, and styles to surface deviations.
  • Use Case: a design team can run the check to ensure new components align with the latest guidelines before merge.

Quick Start

Fetch the latest guidelines, specify target UI files or patterns, and run the review to surface guideline violations.

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 UI code for web design guideline compliance?

To audit UI code for web design guidelines, compare your project's frontend components, markup, and styles against the latest Web Interface Guidelines. The review outputs concise file:line references with brief rule violations, surfacing deviations for design teams to fix before merge.

What is a frontend review for web design and accessibility?

A frontend review for web design and accessibility scans your repository's UI code to verify compliance with centralized design guidelines. It automates the identification of markup and style deviations, ensuring consistent UX across the codebase and reducing manual review overhead.

How do I check my repository for accessibility and design violations?

You can check your repository for accessibility and design violations by fetching the latest guidelines, specifying target UI files or patterns, and running a review. The scan compares frontend code against fetched rules and outputs concise file:line references with brief violation details.

Can I scan specific UI files for design guideline deviations?

Yes, you can scan specific UI files for design guideline deviations. The review scope includes front-end components, markup, and styles across the repository or specified file patterns, allowing targeted verification of new components before merging into the main codebase.

What's the best way to ensure consistent UX across a web codebase?

The best way to ensure consistent UX across a web codebase is automating guideline compliance checks. Scanning frontend code against centralized design guidelines surfaces deviations early, allowing design teams to verify new components align with the latest standards before merge.