web-design-guidelines

Audit UI code against Web Interface Guidelines for compliance and accessibility.

Updated Feb 17, 2026
One-click install
npx skills add https://github.com/alexzuosh/alex_skills --skill web-design-guidelines-alexzuosh
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/alexzuosh/alex_skills/tree/main/web-design-guidelines
Command: npx skills add https://github.com/alexzuosh/alex_skills --skill web-design-guidelines-alexzuosh

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill automates the review of user interface code to ensure compliance with established Web Interface Guidelines, improving consistency, accessibility, and overall design quality.

Core Features & Use Cases

  • Automated Compliance Checks: Fetches the latest guidelines and audits provided files against them.
  • Structured Feedback: Outputs findings in a precise file:line format for easy correction.
  • Use Case: Developers can use this skill to automatically check their frontend code for accessibility issues and adherence to design best practices before deployment.

Quick Start

Use the web-design-guidelines skill to review the file 'src/components/Button.vue' 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 frontend code for web design guidelines compliance?

To check frontend code for web design guidelines compliance, you can use an automated skill that fetches external guideline documents and parses your specified source files. It audits your UI code against established web standards to identify rule violations.

Can I automate accessibility checks in my UI code review workflow?

Yes, you can automate accessibility checks within your UI code review workflow by applying a skill that audits frontend files against web interface guidelines. It outputs structured findings in a file:line format, enabling easy correction before deployment.

Does this automated UI compliance check work with Vue files?

Yes, automated UI compliance checks work with Vue files. The skill parses specified source files, such as 'src/components/Button.vue', and audits them against fetched web interface guidelines to detect accessibility issues and design deviations.

What is the best way to ensure design system adherence in frontend development?

The best way to ensure design system adherence in frontend development is to run automated compliance checks against web interface guidelines. This process evaluates your UI code for accessibility issues and design best practices, providing structured feedback for corrections.

How are accessibility violations reported when auditing UI code?

Accessibility violations are reported in a structured file:line format when auditing UI code. This precise output method pinpoints exact locations of web design guideline violations within your frontend source files, facilitating quick and easy correction.