skills.rest
stephanesoares
stephanesoaresCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-design-guidelines

Fetch Web Interface Guidelines and audit UI files for accessibility and UX conformance.

Updated Mar 5, 2026
Search Tags:#design#ui#accessibility#audit#guidelines#ux#web
One-click install
npx skills add https://github.com/stephanesoares/dotfiles --skill web-design-guidelines-stephanesoares
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/stephanesoares/dotfiles/tree/main/config/claude/skills/web-design-guidelines
Command: npx skills add https://github.com/stephanesoares/dotfiles --skill web-design-guidelines-stephanesoares

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Streamline UI compliance by verifying code against the latest Web Interface Guidelines, reducing accessibility gaps and design drift across projects.

Core Features & Use Cases

  • Fetch the latest guidelines from a designated source URL and apply them to your UI files.
  • Read and analyze target files or patterns to identify accessibility violations and UX deviations.
  • Provide a concise conformance report suitable for design reviews and development handoffs.

Quick Start

Provide the target UI files or patterns to review, and run the skill to fetch the latest guidelines and perform the audit.

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 web UI code against accessibility and UX guidelines?▼

To audit web UI code, provide your target UI files or patterns to the skill, which fetches the latest Web Interface Guidelines and compares your code against those rules to return a concise conformance report.

What is a UI accessibility audit and how does it identify design drift?▼

A UI accessibility audit verifies your web project files against the latest Web Interface Guidelines, identifying accessibility violations and UX deviations to reduce design drift across multiple projects.

Can I check UI accessibility conformance across multiple web projects automatically?▼

Yes, you can check UI accessibility conformance across multiple web projects by running the skill on your target UI files or patterns to generate a concise, rule-based conformance report suitable for automated review.

What's the best way to generate a rule-based conformance report for a design review?▼

The best way to generate a conformance report for a design review is to run this skill on your target UI files, which applies rule-based checks to your code and returns findings suitable for development handoffs.

Do I need to manually provide the latest web interface guidelines to run an audit?▼

No, you do not need to manually provide the web interface guidelines because the skill automatically fetches the latest guidelines from a designated source URL before applying the accessibility and UX checks to your files.

What limitations should I expect when checking UX deviations in web UI files?▼

The main limitation when checking UX deviations is that the skill relies on fetching the latest guidelines from a designated source URL, meaning your audit results are bound to the rules available at that specific source and the patterns you provide.

Related Skills

Explore More Design & Creative Skills→
DeltaFoundry850DeltaFoundry850

web-design-guidelines

Detects accessibility and UI violations in web front-ends.

Community
Intermediate
uni-helperuni-helper
95

web-design-guidelines

Analyze UI code for compliance with Web Interface Guidelines.

Official
Intermediate
sandeshbagmaresandeshbagmare

design-system-patterns

Generate design tokens and implement theme switchers for web and mobile UIs.

Community
Advanced
knckknckknckknck

wcag-audit-patterns

Audit WCAG 2.2 conformance with axe-core, pa11y, and lighthouse.

Community
Advanced