skills.rest
mazzasaverio
mazzasaverioCOMMUNITY
Explore all skills by this author →
𝕏@savmazzaGitHub

web-design-guidelines

Review UI code for compliance with Web Interface Guidelines.

Updated Aug 27, 2026
Search Tags:#code quality#accessibility#ui review#design audit#web guidelines
One-click install
npx skills add https://github.com/mazzasaverio/youtube-to-read --skill web-design-guidelines-mazzasaverio
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/mazzasaverio/youtube-to-read/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/mazzasaverio/youtube-to-read --skill web-design-guidelines-mazzasaverio

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps ensure that user interfaces adhere to established web interface guidelines, improving consistency, accessibility, and overall user experience.

Core Features & Use Cases

  • Automated Code Review: Scans UI code files for compliance with best practices and design standards.
  • Accessibility Audits: Checks for common accessibility issues based on defined guidelines.
  • Design Consistency: Verifies that the UI aligns with the project's intended design language.
  • Use Case: When you need to "review my UI" or "check accessibility" of your web components, this skill provides an automated audit.

Quick Start

Use the web-design-guidelines skill to review the file 'src/components/Button.jsx' for compliance.

Frequently Asked Questions about web-design-guidelines

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I check my front-end code for web interface guideline compliance?▼

To check web interface guideline compliance, you can audit UI code files by fetching established external best practices and scanning your components for deviations in design, accessibility, and UX.

What is a UI design audit and how does it improve code quality?▼

A UI design audit is an automated review of front-end code against best practices, identifying deviations to improve UI consistency, accessibility, and overall user experience.

Can I run an accessibility audit on specific UI components?▼

Yes, you can run an accessibility audit on specific UI components by applying fetched web guidelines directly to targeted files or code patterns to identify common issues.

Does this UI review process work with my existing front-end workflow?▼

Yes, the UI review process integrates into front-end development workflows by scanning specified files, such as React components, to verify alignment with intended design language and standards.

What's the best way to verify design consistency across web components?▼

The best way to verify design consistency is to perform an automated code review that fetches external web guidelines and checks your UI components against established design standards.

Are there limitations to automated web guideline compliance checks?▼

Automated web guideline compliance checks require fetching external guidelines to function and focus primarily on identifying code-level deviations rather than visual rendering issues.

Related Skills

Explore More Software Engineering Skills→
uni-helperuni-helper
95

web-design-guidelines

Analyze UI code for compliance with Web Interface Guidelines.

Official
Intermediate
luiztrilhaluiztrilha

audit

Audit websites for accessibility, performance, theming, and anti-patterns with severity ratings.

Community
Advanced
CrokilyCrokily
2

web-design-guidelines

Review UI code for compliance with Web Interface Guidelines.

Community
Intermediate
act70255act70255

ui-visual-validator

Validate UI components for visual consistency, design system compliance, and accessibility.

Community
Advanced