skills.rest
alaminmain
alaminmainCOMMUNITY
Explore all skills by this author →
𝕏@alaminmainGitHub

web-design-guidelines

Audit HTML, CSS, and JavaScript UI code against Web Interface Guidelines.

Updated Dec 22, 2025
Search Tags:#accessibility#frontend#audit#quality-assurance#web-design#UI guidelines
One-click install
npx skills add https://github.com/alaminmain/DoorAuthServer --skill web-design-guidelines-alaminmain
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/alaminmain/DoorAuthServer/tree/main/.agent/skills/web-design-guidelines
Command: npx skills add https://github.com/alaminmain/DoorAuthServer --skill web-design-guidelines-alaminmain

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams quickly verify that their web interfaces comply with established Web Interface Guidelines, ensuring accessible, consistent, and usable UI across products.

Core Features & Use Cases

  • Guideline Compliance Check: Evaluate HTML, CSS, and JavaScript for adherence to the latest web interface guidelines.
  • Accessibility Audits: Identify color contrast issues, keyboard navigation gaps, semantic structure problems, and ARIA usage.
  • Use Case: Given a codebase or a set of UI files, run the audit to surface violations and recommended fixes, enabling faster remediation during reviews.

Quick Start

Use the web-design-guidelines skill to fetch the latest rules and run an audit against your project files.

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 web design guidelines?▼

To audit UI code for accessibility and web design guidelines, fetch the latest rules and apply them to your HTML, CSS, and JavaScript files to produce a concise report of violations and recommended fixes.

What specific accessibility issues can a frontend code audit detect?▼

A frontend code audit detects accessibility issues including color contrast problems, keyboard navigation gaps, semantic structure errors, and improper ARIA usage across your web interface.

Can I use this audit on an existing HTML and CSS codebase during design reviews?▼

Yes, you can use this audit on existing HTML and CSS codebases during design reviews to quickly verify compliance and surface usability issues for retrofit scenarios.

What is the best way to check ARIA usage and semantic structure in web interfaces?▼

The best way to check ARIA usage and semantic structure is to run an automated audit that fetches current web interface guidelines and evaluates your frontend code against those specific rules.

Do I need to manually configure quality assurance rules before auditing my UI?▼

No, you do not need to manually configure quality assurance rules because the audit automatically fetches the latest web interface guidelines from the specified source before evaluating your code.

Related Skills

Explore More Design & Creative Skills→
allthingslinuxallthingslinux
4

web-design-guidelines

Evaluate UI files against Web Interface Guidelines and report violations.

Official
Basic
patricio0312revpatricio0312rev
5

accessibility-auditor

Audit web interfaces for WCAG 2.1 accessibility issues and remediation steps.

Community
Intermediate
JaiminVadadoriyaJaiminVadadoriya
1

web-design-guidelines

Review UI code compliance with Web Interface Guidelines.

Community
Basic
bdbchbdbch
2

accessibility-review

Audit web applications for WCAG 2.1/2.2 accessibility compliance in Chrome.

Community
Advanced