web-design-guidelines

Scan frontend files and report UI guideline violations with file:line locations.

8|Updated Mar 9, 2026
One-click install
npx skills add https://github.com/JEO-tech-ai/oh-my-unity3d --skill web-design-guidelines-jeo-tech-ai
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/JEO-tech-ai/oh-my-unity3d/tree/main/.unity-skills/web-design-guidelines
Command: npx skills add https://github.com/JEO-tech-ai/oh-my-unity3d --skill web-design-guidelines-jeo-tech-ai

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This tool helps teams ensure their UI code aligns with the latest web interface guidelines, reducing usability and accessibility issues.

Core Features & Use Cases

  • Guideline Fetching: fetch the latest guidelines from vercel-labs/web-interface-guidelines and keep checks up-to-date.
  • Rule Application: read target files and apply all fetched rules to identify non-compliant UI patterns.
  • Reporting: present findings in a concise file:line format for quick remediation.

Quick Start

Review UI code by fetching the latest guidelines and applying them to your project to surface 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 frontend UI code for web interface guideline violations?

To audit frontend UI code, provide your project files for scanning. The tool fetches the latest web interface guidelines, compares your code against them, and reports violations with precise file:line locations for quick remediation.

Does this web design review tool work with React and Vue components?

Yes, the web design review tool works with React, Vue, Svelte, and standard HTML/CSS frontend projects. It scans user-provided files across these frameworks to identify non-compliant UI patterns and flag deviations.

Can I check HTML and CSS accessibility automatically against current web guidelines?

Yes, you can check HTML and CSS accessibility automatically. The tool fetches fresh web interface guidelines covering accessibility and UI standards, then applies all rules to your provided files to surface non-compliant code.

What is the best way to identify UI code that deviates from web accessibility standards?

The best way to identify deviating UI code is to scan your frontend files against fetched web interface guidelines. It applies current accessibility and UI rules, then outputs findings in a concise file:line format for quick remediation.

Do I need to manually update accessibility rules to perform a design review?

No, you do not need to manually update accessibility rules for a design review. The tool automatically fetches the latest guidelines from the vercel-labs/web-interface-guidelines repository to ensure checks remain up-to-date.