web-design-guidelines

Fetch latest Web Interface Guidelines and review UI code files for compliance.

Updated Mar 7, 2026

Search Tags:#ui #code review #accessibility #frontend #web design #guidelines

Ready to run

npx skills add https://github.com/hwchiu/momo --skill web-design-guidelines-hwchiu

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/hwchiu/momo/tree/main/.claude/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/hwchiu/momo --skill web-design-guidelines-hwchiu

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

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

Core Features & Use Cases

Automated Review: Fetches the latest guidelines and checks provided files against them.
Compliance Checking: Identifies deviations from best practices in UI code.
Use Case: A developer can use this skill to audit a new component's UI code for accessibility and design standard compliance before merging it into the main branch.

Quick Start

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

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 frontend code for web design guidelines and accessibility compliance?▼

To check frontend code for web design guidelines and accessibility compliance, this Skill fetches the latest rules and audits specified UI files to identify deviations from design consistency standards.

What is the best way to automate UI code review for design consistency before merging?▼

Automating UI code review for design consistency involves fetching established web interface guidelines and applying rule-based checks to component files, which highlights accessibility issues before merging code into the main branch.

Can I use this to audit specific component files like a React Button component?▼

Yes, you can audit specific component files by providing the file path, such as 'src/components/Button.tsx', to review the UI code against the latest web interface guidelines for standard compliance.

Does web design compliance checking require external dependencies or rule configurations?▼

Web design compliance checking requires fetching external guidelines to apply rule-based checks, but operates with no internal dependencies, directly auditing provided front-end code files against the fetched standards.

When do I need to run an accessibility audit on my UI code?▼

You need to run an accessibility audit on UI code when ensuring user interface adherence to established web interface guidelines, typically during front-end development workflows to improve overall user experience before deployment.