web-design-guidelines

Audit frontend UI files for compliance with web design and accessibility guidelines.

Updated Apr 17, 2026
One-click install
npx skills add https://github.com/hackfest-dev/HF26-24 --skill web-design-guidelines-hackfest-dev
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/hackfest-dev/HF26-24/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/hackfest-dev/HF26-24 --skill web-design-guidelines-hackfest-dev

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Review files to ensure compliance with Web Interface Guidelines and accessibility best practices, enabling faster, consistent UI reviews across projects.

Core Features & Use Cases

  • Guidance-driven reviews: compares UI code against latest Web Interface Guidelines to surface non-conformant patterns.
  • Automated checks: identifies accessibility, semantic, and visual consistency issues in frontend code.
  • Use Case: when asked to review a site or component library for accessibility and design conformance, run a guided audit and generate a concise report.

Quick Start

Provide the UI files or a link to review, and I will fetch the latest guidelines and audit your UI for accessibility and design compliance.

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 frontend code for accessibility and UI compliance?▼

To audit frontend code for accessibility and UI compliance, provide your UI files or a link. The system fetches the latest web interface guidelines, reads target files, applies all rules, and reports findings in a concise, actionable format.

What is automated UI accessibility review and how does it work?▼

Automated UI accessibility review compares frontend code against current web interface guidelines to surface non-conformant patterns. It identifies accessibility, semantic correctness, and visual consistency issues in components and pages.

Can I review a component library for semantic correctness and visual consistency?▼

Yes, you can review a component library for semantic correctness and visual consistency. Provide the target files, and the system applies design and accessibility rules to audit the library and generate a concise report.

What's the best way to check web interface guidelines conformance across multiple projects?▼

The best way to check web interface guidelines conformance across projects is running a guidance-driven audit. This fetches the latest guidelines and applies rules to target files, enabling faster, consistent UI reviews.

Does the accessibility audit work without external dependencies?▼

Yes, the accessibility audit works without external dependencies. You only need to provide the UI files or a link to review, and the system fetches the latest guidelines and evaluates the target files internally.

Why should I use an automated design review instead of manual checks?▼

Automated design review ensures consistent UI compliance across projects by fetching the latest web interface guidelines and applying all rules systematically. This reduces manual effort and surfaces non-conformant patterns faster.