skills.rest
revokslab
revokslabOFFICIAL
Explore all skills by this author →
WebsiteGitHub

web-design-guidelines

Analyzes HTML, CSS, and JavaScript files against Web Interface Guidelines for accessibility, usability, and consistency.

1.7k|471|Updated Feb 1, 2025
Search Tags:#accessibility#frontend#usability#design-review#web-standards#UI-guidelines
One-click install
npx skills add https://github.com/revokslab/ShipFree --skill web-design-guidelines-revokslab
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/revokslab/ShipFree/tree/main/.cursor/skills/web-design-guidelines
Command: npx skills add https://github.com/revokslab/ShipFree --skill web-design-guidelines-revokslab

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps ensure UI code adheres to established Web Interface Guidelines, catching accessibility, usability, and consistency issues early in the review process.

Core Features & Use Cases

  • Guideline-based reviews: Compare UI files against up-to-date web interface rules for accessibility, semantic structure, and visual consistency.
  • Automated checks: Identify common frontend pitfalls that affect usability and accessibility.
  • Use Case: When asked to review my UI or audit design, provide actionable findings and prioritized fixes.

Quick Start

Provide the path to the UI files or code patterns to review. Example: review all files matching index.html, components/, or pages/.

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

You can audit your UI by providing paths to HTML, CSS, and JavaScript files or code patterns. The skill fetches current Web Interface Guidelines and analyzes the code to produce concise per-file accessibility and usability findings.

What is a UI design review against web standards?▼

A UI design review against web standards compares frontend code to rules for accessibility, semantic structure, and visual consistency. This skill fetches the latest guidelines via WebFetch and applies them to your provided UI files.

Can I check my website's frontend code for accessibility compliance automatically?▼

Yes, you can check frontend accessibility automatically by providing paths to your UI files. The skill evaluates HTML, CSS, and JavaScript against the latest Web Interface Guidelines to identify common accessibility and usability pitfalls.

Does this UI review work with raw HTML and CSS files?▼

Yes, this UI review works with raw HTML, CSS, and JavaScript files. You provide the file paths or code patterns, and it applies web interface rules directly to the code to detect accessibility and usability gaps.

How do I check my site against best practices for UX consistency?▼

To check your site against best practices for UX consistency, provide your UI file paths for review. The skill fetches current web interface guidelines and produces actionable findings highlighting frontend pitfalls affecting visual consistency.

Related Skills

Explore More Design & Creative Skills→
vudovnvudovn
8.1k

web-design-guidelines

Audit UI code against Web Interface Guidelines for accessibility and usability issues.

Community
Intermediate
jewbetchajewbetcha
115

web-design-guidelines

Automate UI compliance checks against Web Interface Guidelines.

Community
Basic
pradyumnasagarpradyumnasagar
6

agent-handoff

Automate inter-skill data transfer and provenance capture via JSON Material Passports.

Community
Advanced
lucasloutayflucasloutayf

browser-testing-with-devtools

Diagnose browser-rendered issues by inspecting real-time DOM, console, and network data.

Community
Advanced