skills.rest
noahwins-ng
noahwins-ngCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Audit UI components, HTML structures, and CSS patterns against design and accessibility standards.

1|Updated Apr 12, 2026
Search Tags:#code review#best practices#accessibility#frontend#web design#ui audit
One-click install
npx skills add https://github.com/noahwins-ng/equity-data-agent --skill web-design-guidelines-noahwins-ng
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/noahwins-ng/equity-data-agent/tree/main/.claude/skills/web-design-guidelines
Command: npx skills add https://github.com/noahwins-ng/equity-data-agent --skill web-design-guidelines-noahwins-ng

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill ensures that your web interface code adheres to established design and accessibility standards, preventing common UI pitfalls and usability issues.

Core Features & Use Cases

  • Automated UI Auditing: Scans your codebase for compliance with Web Interface Guidelines.
  • Accessibility Checks: Identifies potential accessibility barriers in your markup.
  • Use Case: Use this skill during a code review to verify that a new component library or page layout meets the required design system and accessibility best practices before deployment.

Quick Start

Ask the agent to review the files in your src directory against the web design guidelines.

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

To audit UI code for accessibility, the skill scans local project source code and evaluates HTML structures and CSS patterns against fetched external design guidelines to identify compliance issues.

What is a UI audit against web interface guidelines?▼

A UI audit against web interface guidelines evaluates frontend code to ensure it adheres to established design and accessibility standards, preventing common usability pitfalls before deployment.

Can I use this to check frontend components during a code review?▼

Yes, you can use this during a code review to verify that new frontend components and page layouts meet required design system and accessibility best practices.

Do I need network access to perform an automated UI audit?▼

Yes, network access is required to fetch the latest rule definitions from external guideline sources, and local file system access is needed to analyze the project source code.

What is the best way to check HTML structures for accessibility barriers?▼

The best way to check HTML structures is to ask the agent to review your src directory, allowing it to scan markup and identify potential accessibility barriers automatically.

Related Skills

Explore More Software Engineering Skills→
remcostoetenremcostoeten
14

web-design-guidelines

Audit web interface code against design and accessibility standards.

Community
Intermediate
FindMalekFindMalek
9

web-design-guidelines

Audits frontend components for compliance with Web Interface Guidelines.

Community
Intermediate
murphyjosephmurphyjoseph

web-design-guidelines

Audit UI code against official web interface guidelines and accessibility standards.

Community
Intermediate
HouseofmvpsHouseofmvps
115

a11y

Detect and fix deterministic WCAG 2.2 A/AA accessibility violations in HTML files.

Community
Advanced