skills.rest
jasonviipers
jasonviipersCOMMUNITY
Explore all skills by this author →
Website𝕏@jasonviipersGitHub

web-design-guidelines

Analyze web UI code for Web Interface Guidelines compliance and accessibility issues.

Updated Aug 23, 2026
Search Tags:#accessibility#UI#review#guidelines#web-design#design-review
One-click install
npx skills add https://github.com/jasonviipers/okx-trading --skill web-design-guidelines-jasonviipers
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/jasonviipers/okx-trading/tree/main/.trae/skills/web-design-guidelines
Command: npx skills add https://github.com/jasonviipers/okx-trading --skill web-design-guidelines-jasonviipers

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Review UI code for Web Interface Guidelines compliance, helping teams ensure accessibility, consistency, and usability across web interfaces. This reduces design debt and speeds up reviews.

Core Features & Use Cases

  • Guideline-based UI review: Evaluate code and markup against the latest Web Interface Guidelines.
  • Accessibility checks: Validate ARIA attributes, color contrast, keyboard navigation, and semantic markup.
  • Design consistency: Flag deviations in components, typography, spacing, and style tokens.
  • Use Case: When auditing a frontend feature, run this skill on the UI codebase to surface accessibility issues and alignment with guidelines.

Quick Start

Use the web-design-guidelines skill to review the UI files in the attached project for accessibility and guideline conformance.

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 web interface guidelines and accessibility?▼

To audit UI code for web interface guidelines and accessibility, use a review skill that fetches the latest standards, analyzes specified frontend files, and outputs compliance findings in a concise file:line format.

What does an accessibility check for frontend projects typically validate?▼

An accessibility check for frontend projects typically validates ARIA attributes, color contrast, keyboard navigation, and semantic markup to ensure web interfaces are usable and compliant with current standards.

Can I review design consistency in components and style tokens?▼

Yes, you can review design consistency by flagging deviations in components, typography, spacing, and style tokens, ensuring that UI implementations align with established web interface guidelines.

How does a UI design review reduce design debt?▼

A UI design review reduces design debt by automatically evaluating frontend markup against the latest web interface guidelines, surfacing accessibility issues and inconsistencies early to speed up team reviews.

Do I need to provide specific UI files for an accessibility audit?▼

Yes, you need to provide specific UI files or file patterns for an accessibility audit, because the review process reads the attached frontend project code to inspect markup and output precise file:line findings.

Related Skills

Explore More Design & Creative Skills→
dongitrandongitran
3

web-design-guidelines

Audit UI code against Web Interface Guidelines and output file:line findings.

Community
Basic
hulusi-tunchulusi-tunc
3

vercel-web-design-guidelines

Review TSX/JSX/HTML/CSS code for Vercel Web Interface Guidelines compliance.

Community
Intermediate
atro2829-hubatro2829-hub

visual-design-foundations

Define typography, color, spacing, and iconography systems with semantic tokens.

Community
Advanced
mustafazeydanimustafazeydani

accessibility

Automate web accessibility audits against WCAG 2.2 guidelines using Lighthouse.

Community
Advanced