web-design-guidelines

Review UI code for Web Interface Guidelines compliance and output file:line findings.

Updated Jan 28, 2026
One-click install
npx skills add https://github.com/kingsonseang/staco-finance-minimal-landing --skill web-design-guidelines-kingsonseang
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/kingsonseang/staco-finance-minimal-landing/tree/main/.cursor/skills/web-design-guidelines
Command: npx skills add https://github.com/kingsonseang/staco-finance-minimal-landing --skill web-design-guidelines-kingsonseang

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Reviews UI code for Web Interface Guidelines compliance. This skill helps ensure that user interfaces meet current web guidelines, improving accessibility, usability, and consistency across projects.

Core Features & Use Cases

  • Guideline Compliance Check: Fetches the latest Web Interface Guidelines and applies them to target UI files.
  • Comprehensive Audits: Scans UI code for accessibility issues, semantic structure, keyboard navigation, color contrast, and responsive behavior.
  • Reporting & Triage: Outputs findings in a terse file:line format for rapid triage and remediation planning.

Quick Start

  • Review the UI files in your project (e.g., pages//*.vue, components//*.tsx) against the latest guidelines fetched from the specified source, and return issues as file:line records.

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 compliance?

To audit UI code for accessibility and UX compliance, the skill fetches the latest Web Interface Guidelines, reads target files or patterns, and outputs findings in a terse file:line format for rapid triage and remediation planning.

What is the best way to check Vue or React components for web interface guideline violations?

Checking Vue or React components for web interface guideline violations involves scanning UI code for accessibility issues, semantic structure, keyboard navigation, color contrast, and responsive behavior, returning issues as file:line records.

Can I use this skill to evaluate design system consistency across multiple projects?

Yes, you can evaluate design system consistency across multiple projects by applying the fetched Web Interface Guidelines to target UI files, components, and libraries to audit accessibility, usability, and structural compliance.

How does the skill report UI accessibility issues for triage?

The skill reports UI accessibility issues for triage by outputting findings in a terse file:line format. This structure allows rapid identification of semantic structure, keyboard navigation, and color contrast problems for remediation planning.

Related Skills