skills.rest
infinite-loop-factory
infinite-loop-factoryOFFICIAL
Explore all skills by this author →
GitHub

web-design-guidelines

Analyze HTML, CSS, and ARIA code against Web Interface Guidelines.

Updated Aug 23, 2026
Search Tags:#accessibility#UI#review#web-guidelines#frontend-audit#design-best-practices
One-click install
npx skills add https://github.com/infinite-loop-factory/app-factory --skill web-design-guidelines-infinite-loop-factory
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/infinite-loop-factory/app-factory/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/infinite-loop-factory/app-factory --skill web-design-guidelines-infinite-loop-factory

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams ensure their web UI aligns with Web Interface Guidelines, simplifying accessibility and design conformance checks.

Core Features & Use Cases

  • Review UI code against the latest guidelines to identify accessibility issues, color contrast problems, semantic markup gaps, and ARIA usage improvements.
  • Provide actionable findings with references to specific lines and files, enabling fast remediation.
  • Use Case: When you need to review a site for accessibility, UX quality, or adherence to best practices, run this Skill to obtain a concise compliance report.

Quick Start

Inspect your UI by providing the target HTML/CSS/JS files, for example: 'index.html' and 'styles.css'.

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 HTML and CSS for web accessibility and ARIA compliance?▼

You can check UI code for web interface guidelines by submitting your HTML, CSS, and JS files. The audit fetches the latest best practices and outputs actionable findings with specific file and line references.

What is a frontend design audit and how does it identify color contrast problems?▼

A frontend design audit reviews UI code against established web interface guidelines to detect color contrast issues, semantic markup gaps, and ARIA usage improvements, providing a concise compliance report.

Can I use this to review site accessibility for existing web projects?▼

Yes, you can review site accessibility for existing web projects. Simply ask it to check accessibility, and it will apply the latest guidelines to your target files.

What is the best way to verify UI design best practices in my codebase?▼

The best way to verify UI design best practices is to run an automated frontend audit on your target files. It evaluates your code against the latest web guidelines and reports actionable findings.

How do I get actionable findings for semantic markup gaps in my web UI?▼

To get actionable findings for semantic markup gaps, run a UI audit on your target files. The tool analyzes your code and outputs specific file:line references to enable fast remediation.

Related Skills

Explore More Design & Creative Skills→
ashiqcodeleafashiqcodeleaf

claude-design

Generate self-contained HTML artifacts with embedded CSS/JS for design purposes.

Community
Intermediate
VamdawnVamdawn

review-skill

Audit YAML frontmatter, tool declarations, references, and variable usage in Skills.

Community
Advanced
rodrigotoledorodrigotoledo

web-design-guidelines

Identify accessibility and interaction issues in web interfaces against Web Interface Guidelines.

Community
Intermediate
hughescrhughescr
1

hugo-testing

Automate client-side JavaScript tests in Hugo projects using Bun and happy-dom.

Community
Advanced