skills.rest
zizhenchen47-oss
zizhenchen47-ossCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

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

Updated Mar 29, 2026
Search Tags:#accessibility#frontend#ui review#vercel#design review#ux audit#web guidelines
One-click install
npx skills add https://github.com/zizhenchen47-oss/claude-skills --skill web-design-guidelines-zizhenchen47-oss
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/zizhenchen47-oss/claude-skills/tree/main/web-design-guidelines
Command: npx skills add https://github.com/zizhenchen47-oss/claude-skills --skill web-design-guidelines-zizhenchen47-oss

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you review user interfaces for Web Interface Guidelines compliance so you can catch accessibility, interaction, and visual design issues before they reach production.

Core Features & Use Cases

  • Guideline-Based UI Review: Checks your files against the latest published web interface rules rather than a stale local copy.
  • Actionable Findings: Returns concise file:line feedback so developers can fix issues quickly.
  • Typical Uses: Review a page, component, or app shell when you want a UX audit, accessibility pass, or frontend best-practices check.

Quick Start

Ask the skill to review the specified UI files or pattern against the latest web interface guidelines and return any issues in terse file and 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 run a UX audit on frontend components for web interface guidelines?▼

Perform an accessibility check by having the skill inspect your frontend components against the latest fetched web interface rules. It identifies violations and outputs specific file:line references to address accessibility issues.

Does this UI review tool use a static local ruleset or fetch external updates?▼

This UI review fetches the latest published external web interface rules rather than relying on a stale local copy. This ensures your design review checks against current accessibility and interaction standards.

What format do accessibility check findings return when reviewing web pages?▼

Accessibility check findings return in a concise file:line format. This allows developers to quickly locate and resolve interaction or visual design issues found during the frontend best-practice review.

Can I use this for a Vercel app shell best-practice design review?▼

Yes, you can review a Vercel app shell, page, or component for best-practice design compliance. The skill evaluates the product interface against web guidelines and reports actionable UX audit issues.

What's the best way to catch visual design issues before they reach production?▼

The best way to catch visual design issues is to request a frontend design review before shipping. The skill inspects your code against web guidelines and reports concise file:line violations to fix before production.

Related Skills

Explore More Software Engineering Skills→
ClyptAIClyptAI

web-design-guidelines

Audit frontend UI code against Web Interface Guidelines for accessibility and consistency.

Official
Intermediate
darthlinuxerdarthlinuxer

web-design-guidelines

Audit web frontend files against Web Interface Guidelines and output file:line findings.

Community
Intermediate
alexzhang1030alexzhang1030

i-polish

Review frontend interfaces for visual, copy, and interaction issues before release.

Community
Advanced
leafcoderleafcoder
2

web-design-guidelines

Audit web interface code for WCAG, ARIA, and UX compliance.

Community
Intermediate