web-design-guidelines

Enforce web interface design guidelines for accessibility, performance, and UX.

2|1|Updated Feb 27, 2026
One-click install
npx skills add https://github.com/Kaakati/sdh-claude-skills --skill web-design-guidelines-kaakati
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/Kaakati/sdh-claude-skills/tree/main/.claude/skills/web-design-guidelines
Command: npx skills add https://github.com/Kaakati/sdh-claude-skills --skill web-design-guidelines-kaakati

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This Skill addresses the challenge of maintaining high standards in web interface design by providing a comprehensive set of rules for accessibility, performance, and user experience.

Core Features & Use Cases

  • Accessibility Auditing: Checks for compliance with WCAG and other accessibility standards.
  • Performance Optimization: Identifies potential performance bottlenecks in UI implementation.
  • UX Validation: Ensures the user experience aligns with best practices.
  • Use Case: A developer can use this skill to audit a newly designed component to ensure it meets all accessibility requirements before it goes into production.

Quick Start

Use the web-design-guidelines skill to review the accessibility of the file 'index.html'.

Frequently Asked Questions about web-design-guidelines

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

FAQPage Schema
How do I check my web UI code for accessibility and WCAG compliance?

Accessibility auditing checks your web UI code against WCAG standards by fetching external guidelines and applying them to specified files. It identifies compliance gaps in components before production deployment.

What is the best way to validate user experience and performance in web design?

UX validation and performance optimization analyze your UI implementation against best practice guidelines. The process identifies potential performance bottlenecks and ensures the user experience aligns with established web design standards.

Can I run a design audit on user-provided UI patterns instead of specific files?

Yes, design audits can be applied to both specified files and user-provided patterns. The skill fetches the necessary external guidelines and evaluates the provided patterns to enforce web interface design rules.

Does this web design guidelines tool work with standard HTML files like index.html?

Yes, the tool works with standard HTML files like index.html. You can use it to review the accessibility, performance, and UX compliance of individual web files before they go into production.

When do I need to fetch external guidelines for a web interface design audit?

Fetching external guidelines is required when enforcing web interface design rules for accessibility, performance, and UX. The skill retrieves these standards to apply them to your UI code reviews and accessibility checks.