skills.rest
shuretokki
shuretokkiCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Review UI code against fetched web interface guidelines and report violations in file:line format.

Updated Aug 23, 2026
Search Tags:#linting#accessibility#ux#code-review#ui-review#web-guidelines#design-audit
One-click install
npx skills add https://github.com/shuretokki/void --skill web-design-guidelines-shuretokki
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/shuretokki/void/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/shuretokki/void --skill web-design-guidelines-shuretokki

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill automates the tedious, manual process of checking web UI code against a formal set of web interface guidelines so teams can quickly find accessibility, UX, and design violations before shipping.

Core Features & Use Cases

  • Fetches the canonical guidelines from a remote source to ensure reviews use the latest rules.
  • Reads specified files or file patterns, applies the guideline rules, and reports violations in a terse file:line format for easy remediation.
  • Use cases include accessibility audits, pre-merge UI reviews, and consistency checks across component libraries.

Quick Start

Ask the skill to review the specified file or pattern, for example: review src/components/Button.jsx for accessibility and 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 web UI code for accessibility and UX violations?▼

You can automate web UI accessibility and UX audits by providing specific files or glob patterns for review. The tool fetches the latest rules from a remote guidelines URL, reads the files, applies each rule, and reports violations in a terse file:line format.

What is the best way to automate a design audit before merging code?▼

The best way to automate a pre-merge design audit is to run a guideline review on your component files. It checks your UI code against canonical web interface guidelines, ensuring accessibility and design best-practice violations are caught before shipping.

How do I check my component library for web interface guideline compliance?▼

To check component library compliance, provide the file paths or glob patterns to an automated UI review tool. It applies fetched web interface guidelines to your code and outputs any accessibility or UX violations in a concise file:line format.

Does this accessibility review tool require a specific framework?▼

No specific framework is required. The accessibility review applies to web projects where files or glob patterns are provided, reading the specified files directly to check for compliance with web interface guidelines and UX best practices.

How do I get started reviewing a file for web design best practices?▼

To get started, ask the tool to review a specific file path, such as asking it to review src/components/Button.jsx for accessibility and guideline violations. It will fetch the latest rules and output any findings.

Related Skills

Explore More Design & Creative Skills→
deangilmoreremixdeangilmoreremix

web-design-guidelines

Review UI files against web design and accessibility guidelines.

Community
Intermediate
TrecekTrecek
1

audit-defense-standards

Audit codebases against defense standards and report violations by severity.

Community
Advanced
phuonghxphuonghx
1

lint-and-validate

Automate linting, formatting, type checking, and security audits for Node.js/TypeScript and Python codebases.

Community
Advanced
CrumbgrabberCrumbgrabber
3

webapp-testing

Automate local web application testing with Python Playwright scripts.

Community
Intermediate