skills.rest
Dozyboy
DozyboyCOMMUNITY
Explore all skills by this author →
GitHub

hs:web-design-guidelines

Review UI code files against fetched Web Interface Guidelines and report findings.

Updated Jul 19, 2026
Search Tags:#code review#accessibility#frontend#ui review#web design#guidelines#ux audit
One-click install
npx skills add https://github.com/Dozyboy/VSF --skill hs-web-design-guidelines-dozyboy
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: hs:web-design-guidelines
Source: https://github.com/Dozyboy/VSF/tree/main/Day2_VSF/Demo1/harness/plugins/hs/disabled-skills/web-design-guidelines
Command: npx skills add https://github.com/Dozyboy/VSF --skill hs-web-design-guidelines-dozyboy

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Manually auditing UI code against evolving web interface and accessibility best practices is slow and error-prone. This Skill automates the review by fetching the latest guidelines and checking your files against every rule. ## Core Features & Use Cases - Guideline-Based UI Review: Fetches the latest Web Interface Guidelines from the vercel-labs repository and checks your code against all rules. - Accessibility and UX Audits: Identifies compliance issues in your interface code, outputting findings in a terse file:line format for quick fixes. - Use Case: Before shipping a new landing page, ask for a review of your React components to catch accessibility violations and design guideline breaches with exact line references. ## Quick Start Ask the assistant to review my UI files in the components directory against the web interface guidelines.

Frequently Asked Questions about hs:web-design-guidelines

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I review my UI code for accessibility issues?▼

Invoke the skill with a file path or glob pattern pointing to your UI code. It fetches the latest Web Interface Guidelines and checks your files against every rule, reporting violations in file:line format.

What guidelines does this UI review tool check against?▼

It fetches the Web Interface Guidelines from the vercel-labs/web-interface-guidelines repository on GitHub before each review. The fetched document contains all rules and output format instructions used for the audit.

Can I review multiple files or a whole directory at once?▼

Yes, pass a file pattern as the argument to review multiple matching files. If you provide no argument, the skill asks which files you want reviewed.

Does the UI review work offline or with cached guidelines?▼

No, the skill fetches fresh guidelines via WebFetch before each review to ensure rules are current. An internet connection is required to retrieve the guidelines source.

What output format does the design audit produce?▼

Findings are reported in a terse file:line format, listing each guideline violation with its exact location. This makes it easy to jump directly to the offending code and fix it.

Related Skills

Explore More Design & Creative Skills→
ShenQingchuanShenQingchuan
5

web-design-guidelines

Audit HTML and CSS UI files against Web Interface Guidelines.

Community
Intermediate
Async-IOAsync-IO

accessibility-check

Audits web components for WCAG 21 AA compliance across five categories.

Official
Intermediate
samymitysamymity
1

browser-qa

Automate end-to-end browser QA for web applications with smoke, interaction, visual regression, and accessibility checks.

Community
Intermediate
andregusman-raizandregusman-raiz
19

ag-referencia-qualidade

Enforce quality gates, post-execution checklists, and CI metrics in software projects.

Community
Advanced