skills.rest
suiramdev
suiramdevCOMMUNITY
Explore all skills by this author →
Website𝕏@suiramdevGitHub

web-design-guidelines

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

Updated Feb 18, 2026
Search Tags:#linting#accessibility#design-consistency#ui-review#web-design-guidelines#ux-trends
One-click install
npx skills add https://github.com/suiramdev/terryscord-new --skill web-design-guidelines-suiramdev
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/suiramdev/terryscord-new/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/suiramdev/terryscord-new --skill web-design-guidelines-suiramdev

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps ensure UI code complies with established Web Interface Guidelines, reducing accessibility gaps and design inconsistencies across projects.

Core Features & Use Cases

  • Guideline-driven reviews: automatically compare UI files against a centralized set of guidelines.
  • Accessibility checks: detect contrast, semantic markup, keyboard navigation, and ARIA usage issues.
  • Design consistency: flag deviations from typography, spacing, color tokens, and component usage across pages.
  • Use Case: When reviewing a web UI, open the target files and run this Skill to surface accessibility and design-compatibility issues.

Quick Start

Prompt the Skill with the target UI files and ask it to check them against the latest 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 audit UI code for accessibility and design consistency?▼

You can audit UI code by providing target files to check against the latest Web Interface Guidelines. It reviews components for accessibility, design consistency, and UX adherence, then reports findings in a machine-readable format.

What is guideline-driven UI review for web interfaces?▼

Guideline-driven UI review automatically compares user-provided UI files against fetched Web Interface Guidelines to detect accessibility gaps, ARIA usage issues, and design inconsistencies across components.

How do I check web components for ARIA and keyboard navigation issues?▼

You check web components for ARIA and keyboard navigation issues by applying accessibility checks to target UI files, which flags semantic markup and keyboard navigation deviations from established Web Interface Guidelines.

Can I detect typography and color token deviations across multiple UI files?▼

Yes, you can detect typography, spacing, and color token deviations across multiple UI files by running a design consistency check that flags component usage deviations from established guidelines.

Does this UI review process require any external linting dependencies?▼

No external linting dependencies are required. The process independently fetches the latest guidelines, reads target UI files, and reports accessibility and design compliance findings without additional components.

Related Skills

Explore More Design & Creative Skills→
msichtermanmsichterman

web-design-guidelines

Audit UI code against the latest Web Interface Guidelines and report findings in file:line format.

Community
Intermediate
richardnguyen0715richardnguyen0715

design-md

Create, validate, and export Google DESIGN.md files with YAML front matter.

Community
Intermediate
zero3041zero3041
1

plankton-code-quality

Automate code formatting, linting, and fixes with Plankton.

Community
Advanced
VMRam95VMRam95

ui-audit

Evaluate web interfaces against UX design and accessibility guidelines.

Community
Intermediate