skills.rest
Alfie728
Alfie728COMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Assess UI code against Web Interface Guidelines and output file:line findings.

Updated Apr 7, 2026
Search Tags:#automation#ui#accessibility#audit#guidelines#web-design
One-click install
npx skills add https://github.com/Alfie728/my-skills --skill web-design-guidelines-alfie728
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/Alfie728/my-skills/tree/main/web-design-guidelines
Command: npx skills add https://github.com/Alfie728/my-skills --skill web-design-guidelines-alfie728

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams enforce Web Interface Guidelines by analyzing project files and flagging deviations from established standards.

Core Features & Use Cases

  • Guideline Compliance: Automatically fetch and apply the latest Web Interface Guidelines.
  • File Review: Scan requested UI-related files and report non-conformances with concise location-based notes.
  • Use Case: When asked to "review my UI", "check accessibility", or "audit design", run a full scan and produce actionable feedback.

Quick Start

Run a UI review by providing a target file set (e.g., index.html, styles.css) for compliance 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 my HTML and CSS files for accessibility and UX compliance?▼

To audit HTML and CSS files for accessibility and UX compliance, provide your target frontend files for a full scan. The tool fetches the latest Web Interface Guidelines and outputs actionable non-conformance findings in a file:line format.

What is a UI accessibility audit and how does automated guideline checking work?▼

A UI accessibility audit automatically scans frontend code against established standards. Automated guideline checking fetches remote web interface rules, reads target files, and flags deviations with concise location-based notes to enforce compliance.

Can I use this web design audit tool to review my frontend project components?▼

Yes, you can use this audit tool to review frontend project components. It applies to HTML, CSS, and UI components during code reviews and accessibility checks, scanning requested files and reporting non-conformances.

What's the best way to check if my web interface meets current design guidelines?▼

The best way to check if your web interface meets current design guidelines is to run an automated audit. The tool fetches the latest remote guidelines, reads your UI files, and outputs specific deviations in a file:line format.

Does the UI accessibility audit require any dependencies or external libraries?▼

No, the UI accessibility audit requires no dependencies or external libraries. It operates independently to fetch remote guidelines, read target files, and output non-conformance findings directly.

How do I interpret file:line format results from a web design guideline scan?▼

File:line format results from a web design guideline scan pinpoint exact locations of non-conformances. Each finding pairs a file name with a line number, providing concise actionable feedback to fix accessibility and UX deviations.

Related Skills

Explore More Design & Creative Skills→
dongitrandongitran
3

web-design-guidelines

Audit UI code against Web Interface Guidelines and output file:line findings.

Community
Basic
Kevin-Liu-01Kevin-Liu-01
16

web-design-guidelines

Identify UI design and accessibility issues in React/TSX, HTML/CSS, and assets against the latest Web Interface Guidelines.

Community
Intermediate
eron1703eron1703
1

worker-role-frontend

Build UI components for Next.js TypeScript apps with strict typing and design-system compliance.

Community
Advanced
kimjuyoung1127kimjuyoung1127

web-design-guidelines

Identify UI deviations from Web Interface Guidelines in code.

Community
Intermediate