skills.rest
JustineDevs
JustineDevsCOMMUNITY
Explore all skills by this author →
Website𝕏@Trader2GGitHub

web-design-guidelines

Validate UI source files against the latest Web Interface Guidelines.

Updated Mar 20, 2026
Search Tags:#accessibility#a11y#frontend#compliance#guidelines#ui-design#design-review
One-click install
npx skills add https://github.com/JustineDevs/E-Commerce --skill web-design-guidelines-justinedevs
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/JustineDevs/E-Commerce/tree/main/.claude/skills/web-design-guidelines
Command: npx skills add https://github.com/JustineDevs/E-Commerce --skill web-design-guidelines-justinedevs

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps ensure UI implementations conform to Web Interface Guidelines by evaluating code against the latest rules.

Core Features & Use Cases

  • Fetch freshest guidelines from the official source
  • Read target UI files and apply all guidelines
  • Report findings in a concise file:line debug format for quick remediation

Quick Start

Fetch the latest guidelines and run a review against your UI assets to identify non-compliant patterns.

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

You can audit UI compliance by validating frontend source files against the Web Interface Guidelines. This process fetches the latest rules and reports accessibility, color contrast, and typography gaps in a concise file:line format for quick remediation.

What is a UI design review for web interface guidelines?▼

A UI design review for web interface guidelines is an evaluation of source files against the latest compliance rules. It checks accessibility, color contrast, typography, and interaction patterns across websites, apps, and dashboards to identify non-compliant patterns.

Can I use this design review skill with my component library and dashboards?▼

Yes, you can use this design review skill with component libraries and dashboards. It applies to frontend codebases across websites and apps, validating source files against web interface guidelines to report accessibility and UI compliance gaps.

How do I check color contrast and typography compliance in a frontend codebase?▼

To check color contrast and typography compliance in a frontend codebase, fetch the latest web interface guidelines and apply all rules during a source file review. Findings are output in a concise file:line debug format to pinpoint exact remediation locations.

Do I need to manually fetch the latest accessibility guidelines before reviewing my UI?▼

No, you do not need to manually fetch the latest accessibility guidelines before reviewing your UI. The review process automatically fetches the freshest guidelines from the official source URL and applies all rules during the source file validation.

Related Skills

Explore More Design & Creative Skills→
raphaelmansraphaelmans

web-design-guidelines

Audit web UI files against official Web Interface Guidelines and report findings in file:line format.

Community
Intermediate
PlaneInABottlePlaneInABottle

web-design-guidelines

Audits UI code in HTML/CSS/JS projects for guideline non-compliance and outputs file:line findings.

Community
Advanced
wjyugutouwjyugutou

web-design-guidelines

Automate UI code review against Web Interface Guidelines for accessibility and consistency.

Community
Intermediate
elianivaelianiva
203

web-design-guidelines

Audit UI code against Web Interface Guidelines for accessibility and usability.

Community
Intermediate