Does it provide performance optimization tips?

Absolutely. It flags issues like missing image dimensions that cause layout shifts and recommends efficient animation properties like transform and opacity.

Can it help with web accessibility (A11y)?

Yes, it identifies missing ARIA labels, improper semantic tags, and ensures interactive elements are keyboard-accessible.

What standards does this skill use for reviews?

The skill is based on the Vercel Web Interface Guidelines, which emphasize accessibility, performance, and clean interactive patterns.

How do I use this skill in Claude Code?

Simply trigger it with commands like 'Review my UI code' or 'Check design guidelines' followed by the file names you want to audit.

Web Design Reviewer

Name: Web Design Reviewer
Author: eburairu

byeburairu

•

디자인 도구

Reviews UI code for compliance with Vercel Web Interface Guidelines and industry-best practices for accessibility, performance, and UX.

소개

The Web Design Reviewer skill enables Claude to perform rigorous audits of your frontend code based on the Vercel Web Interface Guidelines. It meticulously checks for accessibility gaps, performance bottlenecks, animation anti-patterns, and typography inconsistencies. By analyzing your components against professional standards for touch interactions, focus states, and semantic HTML, this skill ensures your web applications are inclusive, high-performing, and polished to production-grade quality.

주요 기능

Typography and copywriting validation for professional content standards
1 GitHub stars
Performance optimization checks for Core Web Vitals and CLS prevention
Form UX auditing including focus management and autocomplete configuration
Animation and interaction review for reduced motion and touch safety
Automated accessibility (A11y) audits for ARIA labels and semantic HTML

사용 사례

Performing a final UI/UX audit before merging frontend pull requests
Ensuring accessibility compliance for interactive components and forms
Optimizing web performance by identifying layout shifts and rendering issues

소개

주요 기능

Typography and copywriting validation for professional content standards
1 GitHub stars
Performance optimization checks for Core Web Vitals and CLS prevention
Form UX auditing including focus management and autocomplete configuration
Animation and interaction review for reduced motion and touch safety
Automated accessibility (A11y) audits for ARIA labels and semantic HTML

사용 사례

Performing a final UI/UX audit before merging frontend pull requests
Ensuring accessibility compliance for interactive components and forms
Optimizing web performance by identifying layout shifts and rendering issues