web-design-guidelines

Compare frontend code against Web Interface Guidelines and report violations.

Updated Feb 26, 2026
One-click install
npx skills add https://github.com/Trimud/Sheep-Vampires-Yoghurt --skill web-design-guidelines-trimud
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/Trimud/Sheep-Vampires-Yoghurt/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/Trimud/Sheep-Vampires-Yoghurt --skill web-design-guidelines-trimud

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps ensure user interfaces comply with Web Interface Guidelines by automatically evaluating UI code against updated standards and surfacing issues that impact usability and accessibility.

Core Features & Use Cases

  • Automated guideline conformance checks: Compare UI code against the latest Web Interface Guidelines to identify violations.
  • Cross-file coverage: Review frontend components, styles, and markup across projects to catch inconsistencies.
  • Use Case: When designing a new UI, run this Skill to detect accessibility gaps and adherence to design best practices before handoff.

Quick Start

Provide the UI files or patterns to review, and the Skill will fetch the latest guidelines and return any 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 my frontend code for accessibility and UI compliance?

Automated UI auditing evaluates frontend components, styles, and markup against fetched Web Interface Guidelines to identify accessibility gaps and design compliance issues. It returns violations in a concise file:line format for quick resolution.

Can I review UI patterns across multiple project files at once?

Yes, cross-file UI auditing reads frontend components, styles, and markup across projects to catch inconsistencies and validate adherence to Web Interface Guidelines. Provide the target files and it evaluates them collectively for violations.

What is the best way to check if my web design meets current accessibility standards?

Checking web design against current accessibility standards involves fetching the latest Web Interface Guidelines via WebFetch and applying them to your frontend code. This validates a11y compliance and surfaces usability issues before handoff.

Do I need to install any dependencies to run a UI design review?

No dependencies are required to run a UI design review. The Skill operates independently, using WebFetch to retrieve the latest Web Interface Guidelines and evaluating your frontend code directly without additional environment setup.

How does the Skill format UI auditing findings?

UI auditing findings are reported in a concise file:line format. This output pinpoints exact locations of accessibility violations and design guideline infractions within your frontend components and markup for efficient resolution.

When should I run an accessibility audit on my web project?

Run an accessibility audit when designing a new UI, reviewing UX, or preparing for handoff to ensure frontend code complies with the latest Web Interface Guidelines. This detects accessibility gaps and design issues before release.