web-design-guidelines

Automate UI code review against Web Interface Guidelines using external rules.

Updated May 19, 2026

Search Tags:#quality assurance #code review #best practices #accessibility #web design

Ready to run

npx skills add https://github.com/monforje/.opencode --skill web-design-guidelines-monforje

💬 Prompt for ChatGPT / Claude Chat▼

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires fetch, xml2js, axios, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill addresses the need for a thorough and automated review of UI code to ensure compliance with Web Interface Guidelines, enhancing accessibility and user experience.

Core Features & Use Cases

Guideline Compliance: Automated checking of UI code against a set of established web design best practices.
Accessibility Review: Identifies potential accessibility issues that could affect user interaction.
Use Case: Ideal for developers or designers seeking to ensure their web interfaces adhere to current standards and best practices.

Quick Start

Use the web-design-guidelines skill to review the UI code from the latest build by providing the pattern of files to be reviewed, such as 'src/**/*.jsx'.

Frequently Asked Questions about web-design-guidelines

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

FAQPage Schema

How do I automate UI code review for web design compliance?▼

Automate UI code review by providing a file pattern like 'src/**/*.jsx' to check your code against the latest Web Interface Guidelines, ensuring web standards compliance and best practice adherence.

Can I check my JSX files for accessibility issues automatically?▼

Yes, you can check JSX files for accessibility issues automatically by specifying the target file pattern, allowing the tool to identify potential interaction barriers based on fetched web design rules.

What is the best way to ensure web interface guidelines compliance during quality assurance?▼

The best way to ensure web interface guidelines compliance is automating your quality assurance process to fetch and compare the latest rules directly against your UI code, verifying accessibility and best practices.

Does this automated web design review fetch external rules?▼

Yes, the automated web design review fetches the latest rules from an external source using dependencies like axios and fetch to compare your code against current standards.

How do I review specific UI code files for best practices adherence?▼

Review specific UI code files for best practices adherence by passing a glob pattern matching your source files, which triggers an automated comparison against established web design guidelines.