skills.rest
hayatosc
hayatoscCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Review HTML, CSS, and JavaScript files against Web Interface Guidelines and accessibility rules.

1|Updated Feb 16, 2026
Search Tags:#design#ui#code review#accessibility#audit#guidelines#web
One-click install
npx skills add https://github.com/hayatosc/dotfiles --skill web-design-guidelines-hayatosc
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/hayatosc/dotfiles/tree/main/home/dot_agents/skills/web-design-guidelines
Command: npx skills add https://github.com/hayatosc/dotfiles --skill web-design-guidelines-hayatosc

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Many UI reviews are manual, inconsistent, and miss accessibility or design-guideline violations; this Skill automates checking front-end code against an authoritative set of web interface guidelines so reviewers can find issues quickly and consistently.

Core Features & Use Cases

  • Fetches the latest Web Interface Guidelines from the canonical source before each review to ensure checks are up to date.
  • Reads user-provided files or file patterns (HTML, CSS, JS, templates) and applies the fetched rule set to identify accessibility, UX, and best-practice violations.
  • Outputs findings in a terse file:line format suitable for quick triage, continuous integration checks, or pull request comments.
  • Use Case: Run a pre-merge audit on a pull request to surface accessibility failures and design inconsistencies across components.

Quick Start

Review the files matching the pattern site/**/*.html for accessibility and guideline violations using the web-design-guidelines skill.

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 frontend code for accessibility and UX guideline violations?▼

To audit frontend code for accessibility and UX violations, provide your HTML, CSS, or JavaScript files and the tool fetches the canonical Web Interface Guidelines to evaluate each rule, outputting findings in a concise file:line format for quick triage.

Can I check HTML and CSS files against web design guidelines before a pull request merge?▼

Yes, you can check HTML and CSS files against web design guidelines by applying the rule set to your supplied files or patterns, making it suitable for running pre-merge audits on pull requests to surface design inconsistencies.

What is the best way to automate web interface guideline compliance checks for a component library?▼

Automating web interface guideline compliance involves fetching the latest authoritative rules from a specified URL, reading your component library files, and evaluating each rule against them to identify best-practice and accessibility issues automatically.

Does this UI code review tool require any specific dependencies or component installations?▼

No, this UI code review tool requires no specific dependencies or component installations, allowing you to directly evaluate file patterns like site/**/*.html against the fetched web interface guidelines without additional environment setup.

How does the tool format accessibility audit findings for continuous integration checks?▼

The tool formats accessibility audit findings in a terse file:line notation, which is specifically designed to be suitable for quick triage, continuous integration checks, or automated pull request comments.

Why should I use an automated guideline audit instead of manual UI code review?▼

You should use an automated guideline audit because many manual UI reviews are inconsistent and miss accessibility or design-guideline violations, whereas automating the check ensures reviewers find issues quickly and consistently.

Related Skills

Explore More Design & Creative Skills→
p-potvinp-potvin
1

web-design-guidelines

Assess frontend HTML, CSS, and JavaScript against Web Interface Guidelines and accessibility rules.

Community
Intermediate
jamesjlundinjamesjlundin
32

pr-review

Analyze pull requests and generate structured review reports.

Community
Intermediate
26mitch2626mitch26

land-and-deploy

Merge pull requests, deploy changes, and verify production health via CI/CD pipelines.

Community
Advanced
mustafazeydanimustafazeydani

accessibility

Automate web accessibility audits against WCAG 2.2 guidelines using Lighthouse.

Community
Advanced