skills.rest
cyotee
cyoteeCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Review UI code against the latest Web Interface Guidelines.

Updated Nov 5, 2025
Search Tags:#ui#accessibility#a11y#usability#review#design-review#web-guidelines
One-click install
npx skills add https://github.com/cyotee/crane --skill web-design-guidelines-cyotee
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/cyotee/crane/tree/main/.claude/skills/web-design-guidelines
Command: npx skills add https://github.com/cyotee/crane --skill web-design-guidelines-cyotee

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Review UI code for Web Interface Guidelines compliance, helping teams ensure accessibility, consistency, and usability.

Core Features & Use Cases

  • Fetch latest guidelines and apply them to the provided UI files or patterns
  • Output concise findings in a file:line format for quick remediation
  • Support audits for websites and web apps against up-to-date design rules

Quick Start

Provide the UI files to review, and I will audit them against the latest Web Interface Guidelines.

Frequently Asked Questions about web-design-guidelines

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

FAQPage Schema
How do I audit UI code for accessibility and web guidelines compliance?▼

Audit UI code for accessibility by providing your UI files for review. The tool fetches the latest Web Interface Guidelines, applies all rules to your code, and outputs concise findings in a file:line format for quick remediation.

What is the best way to review web app UI patterns against up-to-date design rules?▼

Review web app UI patterns by supplying the files or patterns to the tool. It fetches the latest official Web Interface Guidelines, applies the design and accessibility rules, and outputs concise findings in a file:line format.

How does a design review for web accessibility handle guideline updates?▼

A design review for web accessibility handles guideline updates by fetching the latest rules from the official source before applying them to your provided UI files, ensuring your site or app validation is always against current standards.

Can I use this for a UX review of existing website files?▼

Yes, you can use this for a UX review of existing website files. It supports audits for websites and web apps against the latest Web Interface Guidelines, checking accessibility, consistency, and usability.

What format does the accessibility audit output use for error reporting?▼

The accessibility audit output uses a terse file:line format for error reporting. This concise format highlights exactly where your UI code violates Web Interface Guidelines, allowing for quick remediation.

Related Skills

Explore More Design & Creative Skills→
devyan18devyan18

web-design-guidelines

Identify UI compliance issues with Web Interface Guidelines in file:line format.

Community
Intermediate
WesleySmitsWesleySmits
6

auditing-accessibility-wcag

Detects WCAG 2.1 accessibility violations in UI components and pages.

Community
Intermediate
elophantoelophanto
116

web-design-guidelines

Fetch web interface guidelines and report UI code compliance in file:line format.

Community
Intermediate
airoweairowe
14

Accessibility Audit Skill

Audit web projects for WCAG 2.1 violations using axe-core and eslint-plugin-jsx-a11y.

Community
Advanced