Can I use this for accessibility checks?

Yes, accessibility is a primary focus of the guidelines, helping you catch ARIA issues and semantic HTML errors.

How does this skill audit my code?

It fetches the latest Web Interface Guidelines from Vercel's repository and applies those rules to your specified files to identify design and accessibility violations.

Does it support different frontend frameworks?

Yes, it analyzes the UI structure and code patterns regardless of the framework, provided the source files are accessible to the environment.

How do I run a review on my entire project?

You can provide a file pattern argument, such as 'src/**/*.tsx', to the skill to audit all matching files in one pass.

Where do the design rules come from?

The rules are dynamically pulled from the official Vercel Labs web-interface-guidelines repository to ensure your code is measured against the most current industry standards.

Web Interface Guidelines Auditor

Name: Web Interface Guidelines Auditor
Author: akiojin

byakiojin

•

디자인 도구

Audits frontend code for compliance with industry-standard design, accessibility, and UX best practices using Vercel's Web Interface Guidelines.

The Web Design Guidelines skill automates the process of reviewing UI code by fetching the latest design standards from Vercel's authoritative source. It helps developers maintain high-quality user interfaces by checking for accessibility issues, design consistency, and UX best practices directly within the Claude Code environment. By providing line-specific feedback in a terse format, it streamlines the code review process, ensuring that every component meets production-grade standards before deployment.

주요 기능

012 GitHub stars

02Dynamic fetching of the latest Web Interface Guidelines from Vercel Labs

03Support for custom file patterns and bulk directory analysis

04Line-specific feedback for rapid UI debugging

05Standardized output format for easy integration into dev workflows

06Automated accessibility and UX compliance auditing

사용 사례

01Pre-PR reviews to catch UX violations before manual code review

02Checking entire frontend directories for design system consistency

03Performing accessibility audits on new React or Vue components

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add akiojin/llmlb web-design-guidelines

For use in Claude.ai and ChatGPT

Download Skill