web-design-guidelines

Audit UI files against the latest Web Interface Guidelines.

7|1|Updated Mar 28, 2026
One-click install
npx skills add https://github.com/skeletorflet/opencode-kit --skill web-design-guidelines-skeletorflet
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/skeletorflet/opencode-kit/tree/main/.opencode/skills/web-design-guidelines
Command: npx skills add https://github.com/skeletorflet/opencode-kit --skill web-design-guidelines-skeletorflet

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The Web Interface Guidelines auditing skill helps teams ensure UI code adheres to established guidelines for accessibility, usability, and performance by validating files against the latest rules sourced from the guidelines repository.

Core Features & Use Cases

  • Fetch latest guidelines from the official source and apply them to your UI files.
  • Read specified files or patterns and run a comprehensive audit for accessibility, semantic correctness, and performance best practices.
  • Use Case: Align a frontend project with evolving guidelines to pass audits and improve user experience.

Quick Start

Provide the UI files or a pattern to review, and the skill will fetch the latest guidelines and audit your code.

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 my frontend codebase for accessibility and UX compliance?

You can audit a component library for design inconsistencies by comparing your files against the latest Web Interface Guidelines. The skill reads specified file patterns, applies accessibility and semantic rules, and reports structured findings for markup compliance.

What is a web design audit and how does it work?

A web design audit checks frontend code against established Web Interface Guidelines to identify accessibility, performance, and UX issues. It fetches the latest rules, reads your target files, applies the rules systematically, and outputs structured findings for remediation.

Can I use this to check website markup against the latest web design guidelines?

Yes, this skill checks website markup by reading your provided files and validating them against the latest Web Interface Guidelines. It assesses accessibility, semantic correctness, and performance compliance for websites and apps requiring UX adherence.

What's the best way to align a frontend project with evolving web accessibility standards?

Align a frontend project with evolving standards by running a comprehensive design audit against the latest Web Interface Guidelines. The skill fetches current accessibility and performance rules, applies them to your codebase, and outputs structured findings to guide remediation.

Does the design audit work without external dependencies or component libraries?

The design audit operates without external dependencies or component libraries. It independently fetches the latest Web Interface Guidelines, reads your specified target files, applies accessibility and semantic rules, and outputs structured compliance findings.