skills.rest
Kevin-Liu-01
Kevin-Liu-01COMMUNITY
Explore all skills by this author →
Website𝕏@kevskgsGitHub

web-design-guidelines

Identify UI design and accessibility issues in React/TSX, HTML/CSS, and assets against the latest Web Interface Guidelines.

16|3|Updated May 5, 2026
Search Tags:#accessibility#frontend#web#design-guidelines#ui-review#conformance
One-click install
npx skills add https://github.com/Kevin-Liu-01/Agent-Machines --skill web-design-guidelines-kevin-liu-01
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/Kevin-Liu-01/Agent-Machines/tree/main/knowledge/skills/web-design-guidelines
Command: npx skills add https://github.com/Kevin-Liu-01/Agent-Machines --skill web-design-guidelines-kevin-liu-01

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps teams ensure UI code complies with Vercel's Web Interface Guidelines, catching design and accessibility issues early in the review process.

Core Features & Use Cases

  • Fetch the latest guidelines from the source URL.
  • Read and analyze the specified UI files (components, HTML/CSS, assets) against the guidelines.
  • Output actionable findings with file references and remediation suggestions to guide fixes during UI reviews.

Quick Start

Provide the files you want reviewed and run the guidelines check against the latest rules.

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 UI code for accessibility and design guideline conformance?▼

To audit UI code for accessibility and design conformance, provide your component files for review. The skill fetches the latest Web Interface Guidelines, analyzes your code against them, and outputs actionable findings with file references and remediation suggestions.

Can I check React and TSX components for web design guideline violations?▼

Yes, you can check React and TSX components for web design guideline violations. The skill applies fetched guidelines across React/TSX components, HTML/CSS, and assets to surface conformance gaps and actionable fixes in a concise file:line format.

What is the best way to surface accessibility issues during a UI review?▼

The best way to surface accessibility issues during a UI review is to fetch the latest Web Interface Guidelines and apply them to your specified frontend files. This identifies violations and outputs clear remediation recommendations with file and line references.

Does this web design guidelines check work with standard HTML and CSS files?▼

Yes, this web design guidelines check works with standard HTML and CSS files. The analysis applies the latest guidelines across React/TSX components, HTML/CSS, and assets to identify conformance gaps and provide actionable fixes.

How do I get actionable fixes for frontend conformance gaps in my code?▼

To get actionable fixes for frontend conformance gaps, run a guidelines check against your target files. The skill identifies UI design and accessibility issues, outputting concise findings in a file:line format with clear violations and remediation recommendations.

Do I need to manually provide web design guidelines for the code audit?▼

No, you do not need to manually provide web design guidelines for the code audit. The skill automatically fetches the latest Web Interface Guidelines from the source URL to analyze your specified UI files and surface conformance gaps.

Related Skills

Explore More Design & Creative Skills→
siberiacancodesiberiacancode
16

web-design-guidelines

Review HTML/CSS and React components against Web Interface Guidelines.

Official
Intermediate
knckknckknckknck

wcag-audit-patterns

Audit WCAG 2.2 conformance with axe-core, pa11y, and lighthouse.

Community
Advanced
tutur3ututur3u
53

web-design-guidelines

Audit HTML, CSS, and JavaScript against Web Interface Guidelines.

Official
Basic
PrakD3PrakD3
1

web-design-guidelines

Identify UI code violating Web Interface Guidelines and report findings in file:line format.

Community
Intermediate