skills.rest
CodeStorm-Hub
CodeStorm-HubOFFICIAL
Explore all skills by this author →
WebsiteGitHub

web-design-guidelines

Audit UI code against Web Interface Guidelines and output file:line findings.

Updated Aug 27, 2026
Search Tags:#accessibility#a11y#frontend#design-guidelines#web-ui#ui-review
One-click install
npx skills add https://github.com/CodeStorm-Hub/stormcomui --skill web-design-guidelines-codestorm-hub
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/CodeStorm-Hub/stormcomui/tree/main/.opencode/skills/web-design-guidelines
Command: npx skills add https://github.com/CodeStorm-Hub/stormcomui --skill web-design-guidelines-codestorm-hub

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Web UI code often fails accessibility, consistency, and UX best practices. This skill helps reviewers quickly verify UI code against the latest Web Interface Guidelines, reducing manual audit time and risk of issues.

Core Features & Use Cases

  • Fetches the latest Web Interface Guidelines and applies them to the provided UI files.
  • Analyzes UI components, markup, and interactions for accessibility and design consistency.
  • Use Case: You need to audit a React component library for keyboard navigation, color contrast, and semantic markup.

Quick Start

Provide the UI files or a file pattern to review.

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 web accessibility and visual consistency?▼

To audit UI code for accessibility and visual consistency, provide your UI files or file patterns to fetch the latest web interface guidelines and output findings in a terse file:line format.

What is the best way to check a React component library against web design guidelines?▼

Checking a React component library against web design guidelines involves analyzing UI components, markup, and interactions for keyboard navigation, color contrast, and semantic markup compliance.

Can I review my design system for a11y issues across multiple web projects?▼

Yes, you can review your design system for a11y issues across multiple web projects by applying the latest web interface guidelines to your UI codebase to ensure accessible interfaces.

How do I automate frontend UI review for UX best practices?▼

Automating frontend UI review for UX best practices requires fetching current web interface guidelines and applying them to your UI files to reduce manual audit time and risk of issues.

What format do UI accessibility audit findings follow?▼

UI accessibility audit findings follow a terse file:line format, outputting specific locations of compliance failures in your UI code for quick reviewer verification.

Do I need external dependencies to check web interface guidelines on my UI codebase?▼

No external dependencies are required to check web interface guidelines on your UI codebase, as the skill operates independently to analyze markup and interactions for design consistency.

Related Skills

Explore More Design & Creative Skills→
roderikroderik
2

rams

Analyze UI components for WCAG accessibility and visual design issues.

Community
Basic
kqcoxnkqcoxn
369

web-design-guidelines

Identify UI design and accessibility issues across project assets.

Community
Intermediate
wildbitcawildbitca
1

common-accessibility

Apply WCAG 2.2 and ARIA practices to UI components.

Official
Intermediate
msichtermanmsichterman

web-design-guidelines

Audit UI code against the latest Web Interface Guidelines and report findings in file:line format.

Community
Intermediate