skills.rest
Draculabo
DraculaboCOMMUNITY
Explore all skills by this author →
𝕏@ohveeeeGitHub

web-design-guidelines

Compare UI code against Web Interface Guidelines for accessibility and UX conformance.

2.0k|254|Updated Nov 29, 2025
Search Tags:#design#ui#accessibility#a11y#guidelines#ux
One-click install
npx skills add https://github.com/Draculabo/AntigravityManager --skill web-design-guidelines-draculabo
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/Draculabo/AntigravityManager/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/Draculabo/AntigravityManager --skill web-design-guidelines-draculabo

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Review UI code for Web Interface Guidelines compliance and accessibility/UX alignment across projects.

Core Features & Use Cases

  • Checks UI code against Web Interface Guidelines to ensure accessibility and usability.
  • Verifies semantic HTML, color contrast, keyboard navigation, and responsive behavior across components.
  • Use Case: Run a batch review on a React project to surface accessibility issues and UX inconsistencies.

Quick Start

Follow the workflow to fetch the latest guidelines and run a UI review on 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 UX conformance?▼

Audit UI code for accessibility and UX conformance by parsing target web files and comparing them against the latest Web Interface Guidelines, outputting findings in a concise file:line format.

What's the best way to check semantic HTML and keyboard navigation across project components?▼

Check semantic HTML and keyboard navigation by running a project-wide UI review that fetches current guidelines and surfaces accessibility issues and UX inconsistencies across components.

Can I run a batch accessibility review on a React project to surface UX inconsistencies?▼

Yes, you can run a batch file check on a React project to verify semantic HTML, color contrast, keyboard navigation, and responsive behavior, identifying accessibility issues across web assets.

What UI elements does a Web Interface Guidelines compliance check verify?▼

A compliance check verifies semantic HTML structure, color contrast ratios, keyboard navigation functionality, and responsive behavior across web components and project assets.

Do I need to manually fetch guidelines before reviewing UI code for accessibility?▼

No, the workflow automatically fetches the latest guidelines from a specified source before parsing target files, ensuring your UI accessibility review uses current conformance standards.

How are accessibility issues reported when auditing web assets?▼

Accessibility issues are reported in a concise file:line format after parsing target files, pinpointing exact locations of UI accessibility and UX conformance failures.

Related Skills

Explore More Design & Creative Skills→
rkz91rkz91
264

web-design-guidelines

Audit web UI code against Web Interface Guidelines and report compliance findings.

Community
Intermediate
ChristineThamChristineTham

web-design-guidelines

Identify UI accessibility and design guideline violations in project files.

Community
Intermediate
MesteriisMesteriis

ui-qa

Routes UI testing and review tasks to specialized skills for visual regression, accessibility checks, and frontend debugging.

Community
Advanced
SteveFeldmanSteveFeldman
5

evinced-web-sdk

Integrate Evinced SDK accessibility scanning into Playwright test suites.

Community
Intermediate