skills.rest
kevinxo328
kevinxo328COMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-design-guidelines

Review HTML, CSS, and frontend files against Web Interface Guidelines.

5|Updated Sep 17, 2022
Search Tags:#ui#accessibility#frontend#code-review#web-guidelines#design-audit
One-click install
npx skills add https://github.com/kevinxo328/mercari-scraper --skill web-design-guidelines-kevinxo328
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/kevinxo328/mercari-scraper/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/kevinxo328/mercari-scraper --skill web-design-guidelines-kevinxo328

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provides an automated, rule-based review of web interface source files to identify accessibility issues, UX regressions, and deviations from an established Web Interface Guidelines document so teams can quickly surface actionable fixes.

Core Features & Use Cases

  • Fetch latest guidelines: Retrieves the authoritative rule set from the canonical source before each review to ensure up-to-date checks.
  • File-pattern analysis: Reads specified files or glob patterns (HTML, CSS, JS/TSX) and applies the guideline rules.
  • Terse, actionable output: Produces findings in a compact file:line format for easy triage and integration into developer workflows.
  • Use Case: Run on a pull request to automatically flag accessibility regressions and formatting or semantic issues against the current web interface guidelines.

Quick Start

Review the files matching src/**/*.tsx for accessibility and guideline 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 audit my frontend code for accessibility and UX issues?▼

To audit frontend code for accessibility and UX issues, this Skill reads specified web interface source files and applies rule-based checks against the latest Web Interface Guidelines, outputting terse file:line findings for quick triage.

What is a web interface design audit for HTML and CSS?▼

A web interface design audit is an automated review of HTML, CSS, and frontend framework files that identifies accessibility regressions, UX deviations, and semantic issues by comparing your source code against an authoritative guideline document.

How do I check UI code for accessibility violations in a pull request?▼

To check UI code for accessibility violations in a pull request, run this Skill on files matching glob patterns like src/**/*.tsx to automatically flag formatting, semantic, and accessibility regressions against current web interface guidelines.

Does this design audit tool work with frontend frameworks and TSX files?▼

Yes, this design audit tool works with frontend frameworks and TSX files by reading specified files or glob patterns across HTML, CSS, and JS/TSX formats to apply guideline rules.

What is the best way to review UI code for Web Interface Guidelines compliance?▼

The best way to review UI code for Web Interface Guidelines compliance is using an automated rule-based tool that fetches the latest canonical rule set, analyzes your source files, and outputs actionable file:line findings for easy integration into developer workflows.

Do I need to manually update the guideline document for a UI review?▼

No, you do not need to manually update the guideline document for a UI review because this Skill fetches the authoritative rule set from the canonical source before each review to ensure up-to-date checks.

Related Skills

Explore More Design & Creative Skills→
devantler-techdevantler-tech
165

web-design-guidelines

Audit HTML, CSS, and frontend assets against Web Interface Guidelines.

Official
Intermediate
funsaizedfunsaized
1

web-design-guidelines

Analyze UI code for Web Interface Guidelines compliance and report findings.

Community
Intermediate
LschulzesLschulzes

web-design-guidelines

Evaluate UI code against Web Interface Guidelines to detect deviations.

Community
Intermediate
rafifosrafifos
6

web-design-guidelines

Identify UI compliance issues against Web Interface Guidelines in file:line format.

Community
Intermediate