web-design-guidelines

Review UI code against Web Interface Guidelines fetched from a specified URL.

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

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 Interface Guidelines, improving consistency, accessibility, and overall design quality.

Core Features & Use Cases

  • Automated Compliance Checks: Scans specified files against a set of predefined UI and accessibility rules.
  • Guideline Fetching: Automatically retrieves the latest guidelines from a remote source before performing checks.
  • Use Case: Before deploying a new feature, use this Skill to audit the UI code for compliance with best practices, catching potential issues early.

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 check my UI code for web design guidelines and accessibility compliance?

To check UI code for web design guidelines compliance, provide your file paths or glob patterns for review. The Skill fetches the latest rules from a specified URL and identifies deviations from accessibility standards and design principles.

How does automated UI code review handle remote guideline fetching?

Automated UI code review uses WebFetch to retrieve the latest Web Interface Guidelines from a specified URL before scanning. This ensures checks always apply the most current design principles and accessibility standards to your codebase.

Can I scan multiple files using glob patterns for accessibility deviations?

Yes, you can scan multiple files for accessibility deviations by specifying glob patterns instead of single file paths. The Skill operates on these patterns to identify non-compliant UI code across your project.

What is the best way to audit UI components for design consistency before deployment?

The best way to audit UI components for design consistency is running an automated compliance check against established Web Interface Guidelines. This catches deviations from best practices early, before you deploy new features.

Do I need WebFetch to review UI code against web interface guidelines?

Yes, WebFetch is required to review UI code against web interface guidelines. The Skill depends on WebFetch to retrieve the latest remote rules, which it then applies to your user-provided files to detect deviations.

What limitations exist when scanning UI code for best practice deviations?

A limitation when scanning UI code for best practice deviations is the dependency on a remote URL for rules; if the fetch fails, compliance checks cannot proceed. Additionally, it focuses on specified file paths rather than runtime behavior.