skills.rest
LippyyDev
LippyyDevCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-design-guidelines

Audits UI code for accessibility, usability, and consistency against Web Interface Guidelines.

1|Updated Apr 7, 2026
Search Tags:#ui#accessibility#audit#review#guidelines#ux#web-design
One-click install
npx skills add https://github.com/LippyyDev/Agate-Antigravity-Helper- --skill web-design-guidelines-lippyydev
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/LippyyDev/Agate-Antigravity-Helper-/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/LippyyDev/Agate-Antigravity-Helper- --skill web-design-guidelines-lippyydev

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Reviews UI code against official Web Interface Guidelines to ensure accessibility, consistency, and usability across surfaces.

Core Features & Use Cases

  • Guideline conformity checks: verify HTML structure, semantic markup, contrast ratios, and responsive behavior.
  • Accessibility auditing: flag ARIA usage, keyboard navigability, and focus management issues.
  • Use Case: drop in a UI component library and have it produce a guideline-compliance report for the latest build.

Quick Start

Provide the UI code files (HTML/CSS/JS) or a pattern to review, and this skill will fetch the latest guidelines and audit the files for 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 HTML and CSS code for UI accessibility and consistency?▼

To audit UI code for accessibility and consistency, provide your HTML, CSS, and JavaScript files. The system fetches latest web interface guidelines and applies rules to produce a concise, location-specific compliance report.

What is a web interface guideline compliance check?▼

A web interface guideline compliance check assesses your UI code against official standards. It verifies semantic HTML structure, contrast ratios, responsive behavior, and ARIA usage to ensure accessibility and usability across surfaces.

Can I review a UI component library for accessibility and keyboard navigability?▼

Yes, you can drop in a UI component library for review. The audit flags ARIA usage, keyboard navigability, and focus management issues, producing a guideline-compliance report for your latest build.

Does the accessibility audit check responsive behavior and contrast ratios?▼

Yes, the accessibility audit checks responsive behavior and contrast ratios. It reviews HTML structure and semantic markup to verify conformity with the latest web interface guidelines across pages and components.

What's the best way to generate an accessibility report for JavaScript UI files?▼

The best way to generate an accessibility report is to specify your JavaScript file patterns for review. The system reads the files, applies all guideline rules, and outputs a concise, location-specific compliance report.

Related Skills

Explore More Design & Creative Skills→
hayatoschayatosc
1

web-design-guidelines

Review HTML, CSS, and JavaScript files against Web Interface Guidelines and accessibility rules.

Community
Intermediate
thec3ukthec3uk

Frontend Accessibility

Guide frontend code to meet accessibility standards like ARIA and keyboard navigation.

Official
Basic
benswiftbenswift
26

frontend-web-engineer

Develops accessible, responsive HTML/CSS/JavaScript interfaces with Playwright-based testing.

Community
Intermediate
bdbchbdbch
2

accessibility-review

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

Community
Advanced