skills.rest
BEIRUX
BEIRUXOFFICIAL
Explore all skills by this author →
GitHub

web-design-guidelines

Review UI code against Web Interface Guidelines and output file:line findings.

Updated Apr 3, 2026
Search Tags:#ui#accessibility#a11y#usability#code-review#web-guidelines#design-audit
One-click install
npx skills add https://github.com/BEIRUX/agent-skills --skill web-design-guidelines-beirux
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/BEIRUX/agent-skills/tree/main/web-design-guidelines
Command: npx skills add https://github.com/BEIRUX/agent-skills --skill web-design-guidelines-beirux

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill automates reviewing website UI code against established Web Interface Guidelines so designers and engineers can quickly find accessibility, UX, and styling violations without manual cross-checking.

Core Features & Use Cases

  • Fetches authoritative rules from the canonical guidelines source to ensure checks are always up to date.
  • Applies rule-based audits to specified files or glob patterns and identifies violations across markup, styles, and structure.
  • Terse, machine-friendly output in file:line format for easy integration into CI pipelines, code reviews, or developer feedback loops.
  • Use Case: Run a pre-release accessibility audit on a site's UI components to generate a compact list of failing lines for engineers to fix.

Quick Start

Review the files in the specified path for accessibility and design guideline violations and return results in file:line 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 website code for accessibility and UI violations?▼

To audit website code for accessibility and UI violations, apply rule-based checks to specified files or glob patterns. The review fetches authoritative guidelines, parses rule definitions, and outputs findings in a terse file:line format suitable for automated processing.

What is the best way to automate a pre-release UX design review?▼

The best way to automate a pre-release UX design review is running an audit on your site's UI components. It cross-checks markup, styles, and structure against Web Interface Guidelines to generate a compact list of failing lines for engineers to fix.

Can I integrate accessibility audit results into a CI pipeline?▼

Yes, you can integrate accessibility audit results into a CI pipeline. The audit outputs findings in a terse, machine-friendly file:line format designed specifically for easy integration into CI pipelines, code reviews, or developer feedback loops.

How do code review audits handle updates to web design guidelines?▼

Code review audits handle updates by fetching the latest guideline document directly from the canonical source. This ensures your accessibility and UX checks are always up to date without requiring manual rule updates.

Do I need to install dependencies to check web interface guidelines?▼

No, you do not need to install dependencies to check web interface guidelines. The Skill operates with no external dependencies and directly reads target files to identify violations across markup, styles, and structure.

Related Skills

Explore More Design & Creative Skills→
wjyugutouwjyugutou

web-design-guidelines

Automate UI code review against Web Interface Guidelines for accessibility and consistency.

Community
Intermediate
kevinbarfleurkevinbarfleur

web-design-guidelines

Identify UI accessibility and design guideline violations in HTML, CSS, and JavaScript files.

Community
Basic
Euraika-LabsEuraika-Labs
14

team-ui

Orchestrate multi-role UI workflows for game projects from specification to polish.

Official
Advanced
Citrus-bitCitrus-bit
135

web-design-guidelines

Review UI code against the Web Interface Guidelines and output file:line violation reports.

Community
Intermediate