web-design-guidelines

Review UI code for compliance with Web Interface Guidelines and accessibility standards.

Updated Mar 14, 2026
One-click install
npx skills add https://github.com/thanhquan3010/hospital-management-system-v3 --skill web-design-guidelines-thanhquan3010
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/thanhquan3010/hospital-management-system-v3/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/thanhquan3010/hospital-management-system-v3 --skill web-design-guidelines-thanhquan3010

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps ensure that user interface code adheres to established web design best practices and accessibility standards, improving the quality and usability of web applications.

Core Features & Use Cases

  • UI Code Review: Analyzes code files against a set of predefined web interface guidelines.
  • Accessibility Auditing: Checks for common accessibility issues within the UI code.
  • Design Best Practice Compliance: Verifies that the design and user experience elements follow industry standards.
  • Use Case: A developer can use this skill to automatically check a new component's code for compliance with the company's design system before it's merged.

Quick Start

Use the web-design-guidelines skill to review the file 'src/components/Button.js' 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 review front-end code for web design and accessibility compliance?

You can check UI code for web design guidelines and accessibility compliance by running an automated review against fetched remote standards. The skill analyzes specified files to identify UX best practice violations before merging components.

What does a UI code accessibility audit check for in front-end components?

A UI code accessibility audit checks front-end components for compliance with established web interface guidelines and accessibility standards. It identifies common accessibility issues and verifies that user experience elements follow industry design best practices.

Can I check a specific component file for UX best practices before merging?

Yes, you can check a specific component file for UX best practices by specifying the file path for review. The skill processes the target file against predefined web design guidelines to ensure it meets design system standards before code integration.

Does this web design guidelines review work with any front-end development workflow?

The web design guidelines review applies to front-end development workflows requiring design audits and UX best practice verification. It operates on specified files or patterns without framework dependencies, making it broadly compatible across different environments.

When do I need to fetch remote guidelines for a UI code review?

You need to fetch remote guidelines for a UI code review at the start of the process to ensure checks use the latest web interface standards. The skill automatically retrieves these remote standards before performing accessibility and design compliance checks.