skills.rest
casperamy
casperamyCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Validate UI code against Web Interface Guidelines and report findings in file:line format.

Updated Aug 23, 2026
Search Tags:#ui#accessibility#usability#code-review#design-guidelines#web-audit
One-click install
npx skills add https://github.com/casperamy/dev-flow-demo --skill web-design-guidelines-casperamy
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/casperamy/dev-flow-demo/tree/main/documents/github_repos/public_snapshots/calcom__cal.com__main/.opencode/skill/web-design-guidelines
Command: npx skills add https://github.com/casperamy/dev-flow-demo --skill web-design-guidelines-casperamy

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Review and validate UI code against Web Interface Guidelines to ensure accessibility and design consistency, reducing QA cycles and UX debt.

Core Features & Use Cases

  • Fetch the latest Web Interface Guidelines before every review.
  • Read specified UI files or patterns to evaluate for compliance.
  • Check against all rules and output findings in the concise file:line format.
  • Use Case: Identify accessibility issues and design deviations across a UI library or product pages.

Quick Start

Provide the target UI files or patterns to review and run the check to receive a concise file:line report.

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 my UI code for accessibility issues?▼

To audit UI code for accessibility issues, you provide target UI files or patterns for review. The tool validates the code against Web Interface Guidelines and outputs findings in a concise file:line format.

What is the best way to check web components against design guidelines?▼

The best way to check web components against design guidelines is to validate them against the latest Web Interface Guidelines. The tool fetches current rules, reads the files, and reports deviations in a terse file:line format.

Can I review an entire project for UI consistency and usability?▼

Yes, you can review an entire project for UI consistency and usability. The tool can be applied to individual web pages, components, or entire codebases to identify design deviations and accessibility issues.

How do I get started with a web accessibility audit?▼

To get started with a web accessibility audit, simply provide the target UI files or patterns you want to review. The tool fetches the latest guidelines and runs a check to deliver a concise file:line report.

What format does the web design audit report use?▼

The web design audit report uses a concise file:line format. It validates your UI code against Web Interface Guidelines and outputs findings tersely, allowing you to quickly locate and address accessibility and design issues.

Related Skills

Explore More Design & Creative Skills→
Insik-HanInsik-Han
16

web-design-guidelines

Audit React, HTML, CSS, and JavaScript files against Web Interface Guidelines.

Community
Intermediate
Choco-emmmChoco-emmm
7

web-design-guidelines

Scan UI code for Web Interface Guidelines compliance and report prioritized violations.

Community
Intermediate
tmcfarlanetmcfarlane
105

web-design-guidelines

Validate UI code against Web Interface Guidelines for accessibility and usability gaps.

Community
Intermediate
1479089714790897
7

kwp-design-accessibility-review

Audit design assets and web pages for WCAG 2.1 AA compliance gaps.

Community
Intermediate