skills.rest
Mateo1099
Mateo1099COMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Audit frontend UI assets against web interface guidelines and report non-compliant items.

Updated Mar 29, 2026
Search Tags:#usability#design-guidelines#design-consistency#ui-review#web-accessibility#frontend-best-practices
One-click install
npx skills add https://github.com/Mateo1099/CampusFlow --skill web-design-guidelines-mateo1099
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/Mateo1099/CampusFlow/tree/main/.trae/skills/web-design-guidelines
Command: npx skills add https://github.com/Mateo1099/CampusFlow --skill web-design-guidelines-mateo1099

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Web teams struggle to ensure UI consistency and accessibility across projects, leading to inconsistent user experiences and missed accessibility targets.

Core Features & Use Cases

  • Guideline convergence: Reconciles multiple UI patterns to a single set of rules.
  • Accessibility checks: Audits color contrast, keyboard navigation, and ARIA usage against guidelines.
  • Use Case: When shipping a new interface, run the check on the codebase to identify deviations from the guidelines and produce a prioritized remediation plan.

Quick Start

Review your project's UI files against the latest Web Interface Guidelines.

Frequently Asked Questions about web-design-guidelines

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I check my frontend codebase for web accessibility and visual consistency issues?▼

When you need to ensure UI consistency before shipping a new interface, run an audit against fetched web interface guidelines to detect deviations in accessibility, keyboard navigation, and visual patterns.

Can I use this to reconcile conflicting UI patterns into a single design system?▼

Yes, you can reconcile multiple UI patterns into a single set of rules by fetching the latest web interface guidelines and auditing your UI assets to enforce design consistency across projects.

How do I audit color contrast and ARIA usage in my UI files?▼

You can audit color contrast and ARIA usage by reading specified UI files and comparing them against fetched web accessibility guidelines, which reports non-compliant items in a concise format.

Does this tool work with my existing design system components?▼

Yes, it works with existing design systems by reading your specified UI files and frontend codebases to check accessibility, visual consistency, and best-practice adherence against web interface guidelines.

What is the best way to enforce frontend best practices across multiple web projects?▼

The best way to enforce frontend best practices is to run automated guideline convergence checks on your codebases, fetching the latest rules to report non-compliant items and produce a prioritized remediation plan.

Related Skills

Explore More Design & Creative Skills→
kensleDevkensleDev

web-design-guidelines

Review UI code against Web Interface Guidelines for accessibility and design compliance.

Community
Intermediate
CallMeLuigiv2CallMeLuigiv2

web-design-guidelines

Audit UI code against current Web Interface Guidelines for accessibility and UX compliance.

Community
Basic
hopeoverturehopeoverture
6

ui-library-usage-auditor

Audit shadcn/ui component usage for accessibility and design-system conformance.

Community
Advanced
MattRibMattRib

web-design-guidelines

Identify UI code violating Web Interface Guidelines and report file:line findings.

Community
Basic