web-design-guidelines

Review UI code against Web Interface Guidelines for accessibility and best practices.

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

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 design quality.

Core Features & Use Cases

  • Automated Code Review: Scans UI code files against a predefined set of web design best practices.
  • Accessibility Checks: Identifies potential accessibility issues within the code.
  • Use Case: A developer can use this skill to audit a new component's code before it's merged, ensuring it meets the project's design standards.

Quick Start

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

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 UI code for accessibility and design guideline compliance?

To review UI code for accessibility and compliance, you can use an automated code review process that scans your files against established web interface guidelines. This skill fetches the latest remote guidelines to audit components and identify potential accessibility issues.

What is the best way to audit front-end components for web design consistency?

The best way to audit front-end components for web design consistency is using an automated review tool that checks source files against predefined best practices. It scans your code to ensure the user interface meets project standards before merging.

Do I need an internet connection to fetch web interface guidelines for code review?

Yes, you need an active internet connection because the UI code review process fetches the latest web interface guidelines from a remote URL before performing accessibility checks and design consistency audits.

Can I use this automated UI code review for any front-end development workflow?

Yes, this automated UI code review is applicable to general front-end development workflows. You can use it to audit new component code files, such as a React button component, to ensure they meet design and accessibility standards.

Why does my UI code review fail to identify accessibility issues in my components?

If your UI code review fails to identify accessibility issues, ensure the skill successfully fetched the latest guidelines from the remote URL. The review specifically scans UI code files against these predefined web interface best practices to detect compliance gaps.

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

You need to run an accessibility check on your UI code before merging a new component. Performing a code review at this stage ensures the user interface meets design consistency standards and resolves potential accessibility issues early.