web-design-guidelines

Analyzes web interface source code for compliance with design, accessibility, and performance guidelines.

Updated Jun 4, 2026
One-click install
npx skills add https://github.com/achmf/KostaHub --skill web-design-guidelines-achmf
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/achmf/KostaHub/tree/main/.agent/skills/web-design-guidelines
Command: npx skills add https://github.com/achmf/KostaHub --skill web-design-guidelines-achmf

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill addresses the inconsistency and accessibility gaps in web interfaces by automating the audit process against established industry design guidelines.

Core Features & Use Cases

  • Automated Compliance Auditing: Scans your UI code to ensure it adheres to modern accessibility and performance standards.
  • Standardized Reporting: Provides clear, actionable feedback in a concise file-line format to help developers fix issues quickly.
  • Use Case: After completing a new feature, run this audit to identify missing ARIA labels, poor contrast ratios, or non-performant patterns before pushing to production.

Quick Start

Use the web-design-guidelines skill to audit the file app/page.tsx for accessibility and performance issues.

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 and performance compliance?

To audit UI code for accessibility and performance compliance, analyze your web interface source code against established design guidelines. This process fetches remote rule sets and applies them to local project files to identify non-compliant patterns like missing ARIA labels.

What is the best way to check web design guidelines before pushing to production?

The best way to check web design guidelines before production is running an automated compliance audit on your completed features. This scans your interface source code to identify poor contrast ratios or non-performant patterns and provides actionable file-line feedback.

Does UI accessibility auditing require network access to retrieve external guidelines?

Yes, UI accessibility auditing requires network access to retrieve external guidelines. The audit process operates by fetching remote rule sets and applying them to local project files, meaning both network connectivity and local file system access are necessary.

Can I use an automated code review to find missing ARIA labels in my web interface?

Yes, you can use an automated code review to find missing ARIA labels in your web interface. The audit analyzes your source code for compliance with established accessibility standards and reports non-compliant patterns in a concise file-line format.

What limitations should I expect when automating web design compliance checks?

When automating web design compliance checks, expect the limitation of requiring both network access to fetch remote rule sets and local file system access to perform the code audits. Without network connectivity, the external guidelines cannot be retrieved.