skills.rest
benjgrad
benjgradCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Review UI code against Web Interface Guidelines for accessibility and design compliance.

Updated Jan 29, 2026
Search Tags:#design#ui#code review#accessibility#guidelines#ux
One-click install
npx skills add https://github.com/benjgrad/clawdbot --skill web-design-guidelines-benjgrad
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/benjgrad/clawdbot/tree/main/skills/web-design-guidelines
Command: npx skills add https://github.com/benjgrad/clawdbot --skill web-design-guidelines-benjgrad

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 best practices.
  • Compliance Checking: Verifies adherence to accessibility and design standards.
  • Use Case: Developers can use this Skill to automatically audit their front-end code for potential design flaws or accessibility issues before deployment.

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 best practices?▼

To review UI code for accessibility and design best practices, use an automated tool to scan your front-end files against established web interface guidelines, identifying compliance issues before deployment.

What does an automated front-end design audit check for?▼

An automated front-end design audit checks your UI code for compliance with predefined web interface guidelines, verifying adherence to accessibility standards and overall design quality to improve consistency.

How do I check my front-end components for web interface guideline compliance?▼

You check front-end components for web interface guideline compliance by running a rule-based analysis on specified files or directory patterns to detect accessibility flaws and design inconsistencies.

Can I audit specific front-end files for accessibility issues before deployment?▼

Yes, you can audit specific front-end files for accessibility issues by specifying the target file path in your automated design review workflow to perform comprehensive rule-based analysis.

Does automated UI code review work with standard front-end development workflows?▼

Automated UI code review integrates directly into standard front-end development workflows by fetching remote guidelines and applying them to your codebase to ensure deployment readiness and compliance.

What are the limitations of automated design compliance checking?▼

Automated design compliance checking is limited to predefined rules fetched from remote sources and may not catch subjective visual design flaws or complex dynamic accessibility interactions in your UI code.

Related Skills

Explore More Design & Creative Skills→
CrokilyCrokily
2

web-design-guidelines

Review UI code for compliance with Web Interface Guidelines.

Community
Intermediate
NammDevNammDev
2

web-design-guidelines

Audit frontend HTML/CSS/JS code for Web Interface Guidelines compliance and accessibility issues.

Community
Intermediate
kwt00kwt00

visual-verdict

Generate JSON verdicts comparing UI screenshots to reference images via pixel matching and structural analysis.

Community
Advanced
remcostoetenremcostoeten
14

web-design-guidelines

Audit web interface code against design and accessibility standards.

Community
Intermediate