skills.rest
coco-research
coco-researchCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Review UI code against Web Interface Guidelines and flag violations.

264|11|Updated Apr 25, 2026
Search Tags:#code review#accessibility#ui review#design guidelines#ux audit#web interface
One-click install
npx skills add https://github.com/coco-research/coco --skill web-design-guidelines-coco-research
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/coco-research/coco/tree/main/skills/web-design-guidelines
Command: npx skills add https://github.com/coco-research/coco --skill web-design-guidelines-coco-research

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you quickly audit UI code against Web Interface Guidelines so you can catch accessibility, interaction, and visual consistency issues before they reach production.

Core Features & Use Cases

  • Guideline-based UI Review: Compares your code against the latest web interface rules pulled from the official source.
  • Accessibility and UX Checks: Flags common issues in layouts, components, and page flows that affect usability and compliance.
  • Terse Findings Output: Produces concise file-and-line feedback that is easy to act on during code review.
  • Use Case: Use it when you want a fast design and accessibility pass on a React page, landing screen, or component library update.

Quick Start

Ask me to review the specified UI files for web interface guideline compliance and return only the key findings.

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 guideline compliance before release?▼

Audit UI code for web interface guideline compliance by reviewing components and layouts against the latest remote design rules to flag accessibility, interaction, and visual design violations before release.

What is a UX audit for web components and how does it catch accessibility issues?▼

A UX audit for web components catches accessibility issues by comparing UI code against official web interface guidelines, identifying visual consistency and interaction barriers in page flows before production.

How do I get file and line feedback for visual design violations in a React page?▼

Get file and line feedback for visual design violations in a React page by running a UI review that returns terse, audit-ready findings pointing to exact locations of accessibility and interaction issues.

Can I use this for a component library update and do I need to fetch guidelines manually?▼

Yes, you can use this for a component library update, and no manual fetch is needed because the latest remote guideline source is fetched automatically on each run to ensure current compliance checks.

What's the best way to catch interaction issues in web layouts during code review?▼

The best way to catch interaction issues in web layouts during code review is running an automated UI audit that checks page flows against web interface guidelines and outputs concise file:line findings.

Related Skills

Explore More Software Engineering Skills→
amaledtuningamaledtuning

web-design-guidelines

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

Community
Intermediate
oiagorodriguesoiagorodrigues

web-design-guidelines

Identify UI code violating Web Interface Guidelines and accessibility best practices.

Community
Intermediate
MeechYourGoalsMeechYourGoals
2

chravel-ui-consistency

Audit Chravel's user interface for visual consistency and design system adherence.

Community
Intermediate
distribucionesfayosmoreno-sysdistribucionesfayosmoreno-sys

ui-visual-validator

Validate UI modifications for visual regression, compliance, and accessibility.

Community
Advanced