skills.rest
corvo007
corvo007COMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Assess HTML/CSS/JS UI code against Web Interface Guidelines.

793|52|Updated Nov 22, 2025
Search Tags:#ui#accessibility#a11y#guidelines#ux#web-design#conformance
One-click install
npx skills add https://github.com/corvo007/MioSub --skill web-design-guidelines-corvo007
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/corvo007/MioSub/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/corvo007/MioSub --skill web-design-guidelines-corvo007

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

UI code often fails to meet accessibility and UX guidelines, leading to unusable interfaces and inconsistent design. This Skill provides automated reviews that flag deviations from the Web Interface Guidelines and offers remediation guidance to bring code into compliance.

Core Features & Use Cases

  • Automated accessibility checks: ARIA usage, color contrast, keyboard navigation, and focus management.
  • Design-token and style-consistency validation: typography, spacing, components, and design language adherence.
  • UX and usability audits: responsive behavior, predictable interactions, and error handling consistency.
  • Use Case: when integrating new components or reviewing a UI codebase, run this Skill to identify conformance gaps and receive concrete fixes.

Quick Start

Provide the UI files or patterns to review, and I will fetch the latest guidelines and assess conformance.

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 HTML and CSS for accessibility compliance?▼

To audit HTML and CSS for accessibility compliance, provide your UI files or patterns for review. The system fetches official guidelines and checks ARIA usage, color contrast, and keyboard navigation, outputting findings in a terse file:line format.

What is automated UI conformance review for web design?▼

Automated UI conformance review is the process of assessing web pages and components against official Web Interface Guidelines. It flags deviations in accessibility, design consistency, and responsive UX, providing concrete remediation guidance to bring code into compliance.

Can I check design token consistency and UX patterns across a web project?▼

Yes, you can check design token consistency and UX patterns across a web project. The review validates typography, spacing, component adherence, responsive behavior, and error handling consistency against fetched guidelines.

How do I fix ARIA usage and keyboard navigation issues in my UI code?▼

To fix ARIA usage and keyboard navigation issues, run an automated accessibility check on your specified files. The review identifies conformance gaps and offers remediation guidance to resolve focus management and interaction problems.

Does this accessibility checker require specific frameworks or dependencies?▼

No specific frameworks or dependencies are required. The accessibility checker applies to standard HTML, CSS, and JS projects, fetching fresh guidelines from the official source before each review to ensure accurate conformance validation.

Related Skills

Explore More Design & Creative Skills→
sulthonuladibsulthonuladib

web-design-guidelines

Identify UI conformance issues against Web Interface Guidelines in HTML/CSS/JS codebases.

Community
Intermediate
SAPSAP
294

a11y-audit

Audit UI components for WCAG AA accessibility compliance.

Official
Advanced
karchthokarchtho

ui-ux-design

Provide expert UI/UX design guidance for frontend frameworks and design systems.

Community
Intermediate
bdbchbdbch
2

accessibility-review

Audit web applications for WCAG 2.1/2.2 accessibility compliance in Chrome.

Community
Advanced