skills.rest
Icebane84
Icebane84COMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Review web UI source files against Web Interface Guidelines with file:line output.

Updated Mar 24, 2026
Search Tags:#code review#linting#accessibility#web design#ux#ui audit#performance best practices
One-click install
npx skills add https://github.com/Icebane84/Synarche_Workshop --skill web-design-guidelines-icebane84
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/Icebane84/Synarche_Workshop/tree/main/.agent/skills/design/web-design-guidelines
Command: npx skills add https://github.com/Icebane84/Synarche_Workshop --skill web-design-guidelines-icebane84

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It helps you catch UI, accessibility, performance, and best-practice issues early by automatically checking your web interface code against the latest Web Interface Guidelines.

Core Features & Use Cases

  • Guideline-driven audits: Fetches the most recent rules from the authoritative source before running a review.
  • File- or pattern-based scanning: Reviews specific files you provide or prompts you for which files/patterns to check.
  • Actionable output formatting: Reports findings in the required terse file:line format for faster fixes.
  • Use Case: Audit a newly implemented interface screen to ensure accessibility compliance and alignment with best practices before releasing.

Quick Start

Ask the AI to run an audit for the files you specify (for example, “Review my UI files under src/pages and include any accessibility or best-practice findings with file:line output.”).

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 web UI source code for accessibility and best practice violations?▼

To audit web UI source code for accessibility and best practices, provide your target files or directory patterns to the AI. The review fetches the latest Web Interface Guidelines and reports design, UX, and performance issues in a terse file:line format for quick fixes.

What is a UI code audit against web design guidelines?▼

A UI code audit against web design guidelines is an automated review that scans your web interface source files to identify accessibility, UX, and performance issues. It fetches authoritative guideline rules and outputs actionable findings using a file:line format.

Can I check accessibility compliance for specific files or patterns in my project?▼

Yes, you can check accessibility compliance for specific files or patterns. The review allows you to scope the audit to individual UI files you provide or specify directory patterns like src/pages to target relevant source code.

Does the UI review require fetching external guideline rules before scanning?▼

Yes, the UI review requires fetching external guideline rules from a configured Vercel URL before scanning. This ensures the accessibility and best-practice audit always checks your source files against the most recent Web Interface Guidelines.

What's the best way to review UX and design issues in frontend code?▼

The best way to review UX and design issues in frontend code is to run a guideline-driven audit. It scans your web UI source files against the latest Web Interface Guidelines, identifying accessibility and performance problems and reporting them with precise file:line references.

When do I need to run an accessibility and best-practice audit on my web interface?▼

You need to run an accessibility and best-practice audit on your web interface when you have newly implemented UI screens. Checking source code against Web Interface Guidelines before release helps catch design, accessibility, and performance issues early.

Related Skills

Explore More Design & Creative Skills→
anntnzrbanntnzrb
1

web-design-guidelines

Audit UI code against the latest Web Interface Guidelines.

Community
Intermediate
joe-watkinsjoe-watkins
1

a11y-validator

Re-run accessibility tests and verify acceptance criteria against magentaa11y-mcp.

Community
Intermediate
fcouryfcoury
1

analyze-rust-optimizations

Analyze Rust libraries for runtime performance and memory optimization opportunities.

Community
Advanced
noni2shenoni2she
1

web-design-guidelines

Audit web UI source files against Web Interface Guidelines for accessibility compliance.

Community
Basic