skills.rest
tillysoso
tillysosoCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Identify UI design deviations from Web Interface Guidelines in user files.

Updated Sep 10, 2025
Search Tags:#ui#accessibility#a11y#compliance#usability#guidelines#web-design
One-click install
npx skills add https://github.com/tillysoso/mv1 --skill web-design-guidelines-tillysoso
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/tillysoso/mv1/tree/main/.claude/skills/web-design-guidelines
Command: npx skills add https://github.com/tillysoso/mv1 --skill web-design-guidelines-tillysoso

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams assess UI code against established Web Interface Guidelines to improve accessibility, usability, and consistency.

Core Features & Use Cases

  • Fetch and apply updated guidelines to UI assets and code
  • Evaluate HTML/CSS/JS against the latest rules and report violations
  • Use Case: When reviewing a live site or component library for accessibility and visual consistency

Quick Start

Review the latest UI files against the fetched guidelines and report any violations.

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 UI code for accessibility and usability compliance?▼

To check UI code for accessibility and usability compliance, provide your web project files to be evaluated against fetched Web Interface Guidelines, which identifies design deviations and reports violations using file:line notation.

What is the best way to verify visual consistency in a web component library?▼

Verifying visual consistency in a web component library involves validating your HTML, CSS, and JS assets against established Web Interface Guidelines to fetch the latest rules and report any visual design deviations.

How do I evaluate HTML and CSS files against web design guidelines?▼

You evaluate HTML and CSS files against web design guidelines by applying the fetched rules to your provided web project assets, checking for accessibility, usability, and visual consistency violations to output structured findings.

Can I review a live web project for accessibility deviations?▼

Yes, you can review a live web project for accessibility deviations by fetching updated guidelines and applying them to your site's UI code to ensure compliance with established accessibility and usability standards.

What format do web guideline violations get reported in?▼

Web guideline violations are reported in the format defined by the source guidelines, specifically utilizing a file:line notation to pinpoint exact UI design deviations within your provided codebase.

Related Skills

Explore More Design & Creative Skills→
H2OSLabsH2OSLabs

web-design-guidelines

Scan HTML, CSS, and JS files against Web Interface Guidelines and return line-numbered reports.

Official
Intermediate
LschulzesLschulzes

web-design-guidelines

Evaluate UI code against Web Interface Guidelines to detect deviations.

Community
Intermediate
leboncoinleboncoin
92

check-accessibility

Automate WCAG 2.1 AA accessibility testing of Spark UI components with Playwright.

Official
Intermediate
Ikki-GroupIkki-Group

web-design-guidelines

Evaluate UI code against Web Interface Guidelines and output findings in file:line format.

Official
Intermediate