skills.rest
BaoNguyen09
BaoNguyen09COMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-design-guidelines

Review UI code against Web Interface Guidelines and output file:line results.

6|Updated Mar 10, 2026
Search Tags:#design#ui#code review#accessibility#guidelines#web
One-click install
npx skills add https://github.com/BaoNguyen09/grade-pilot --skill web-design-guidelines-baonguyen09
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/BaoNguyen09/grade-pilot/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/BaoNguyen09/grade-pilot --skill web-design-guidelines-baonguyen09

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps ensure that user interface code adheres to established Web Interface Guidelines, improving consistency and quality.

Core Features & Use Cases

  • Automated Compliance Checks: Reviews UI code against a set of predefined rules.
  • Accessibility Audits: Can be used to check for basic design and accessibility best practices.
  • Use Case: Before merging a new UI component, use this Skill to automatically audit its code against the latest design standards.

Quick Start

Review the file 'src/components/Button.jsx' for Web Interface Guidelines compliance.

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 web design guidelines compliance?▼

To check UI code for web design guidelines compliance, this Skill fetches the latest rules and reviews specified files, outputting terse file:line references for any violations found.

Can I automate accessibility audits for UI components before merging?▼

Yes, you can automate accessibility audits for UI components before merging by running this Skill to validate code against current web interface best practices and accessibility rules.

Do I need WebFetch to review files against web interface guidelines?▼

Yes, WebFetch is required to retrieve the latest web interface guidelines, which the Skill then applies to your specified UI files for design and accessibility validation.

What is the output format when validating UI code against design standards?▼

The output format for validating UI code against design standards is a terse file:line list, pinpointing exact locations where your UI code fails to meet web interface guidelines.

How does a design audit work for frontend code?▼

A design audit for frontend code works by fetching predefined web interface rules and scanning your UI files to identify specific lines that violate accessibility and design best practices.

Related Skills

Explore More Design & Creative Skills→
AWS-EducateAWS-Educate

web-design-guidelines

Review UI code against fetched Web Interface Guidelines for compliance.

Official
Basic
WD-CHINAWD-CHINA

web-design-guidelines

Audit HTML and CSS files for design and accessibility compliance.

Community
Intermediate
AnvinX1AnvinX1

web-design-guidelines

Fetch Web Interface Guidelines and audit UI code for accessibility and design consistency.

Community
Intermediate
alexzuoshalexzuosh

web-design-guidelines

Audit UI code against Web Interface Guidelines for compliance and accessibility.

Community
Basic