skills.rest
ntuan2502
ntuan2502COMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-design-guidelines

Fetch external Web Interface Guidelines and apply them to UI code files.

Updated Feb 6, 2026
Search Tags:#code review#accessibility#compliance#web design#guidelines#ui code
One-click install
npx skills add https://github.com/ntuan2502/piggy --skill web-design-guidelines-ntuan2502
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/ntuan2502/piggy/tree/main/.agent/skills/web-design-guidelines
Command: npx skills add https://github.com/ntuan2502/piggy --skill web-design-guidelines-ntuan2502

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill automates the review of UI code to ensure it adheres to established Web Interface Guidelines, catching potential issues before deployment.

Core Features & Use Cases

  • Automated Compliance Checks: Fetches the latest guidelines and applies them to specified files.
  • Rule Enforcement: Verifies code against a comprehensive set of design and accessibility rules.
  • Use Case: After developing a new feature, run this Skill to audit the UI code for adherence to accessibility standards, performance best practices, and overall design consistency.

Quick Start

Use the web-design-guidelines skill to review the file 'src/components/Button.jsx' for 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 audit UI code for accessibility and web design compliance?▼

To audit UI code for accessibility and web design compliance, use the skill to fetch external rules and apply them to your specified UI files. This verifies code against established Web Interface Guidelines.

What is automated UI code review for web design guidelines?▼

Automated UI code review for web design guidelines is the process of fetching external rules and applying them to input files. It checks code for adherence to accessibility standards, performance best practices, and design consistency.

Can I check my UI code against a custom URL for web design rules?▼

Yes, you can check your UI code against a custom URL for web design rules. The review process requires fetching guidelines from a specified URL and processing your input files against those fetched external rules.

How do I review a specific component file for web design guideline violations?▼

To review a specific component file for web design guideline violations, specify the file path like 'src/components/Button.jsx' for the review. The tool processes the input file against fetched rules to identify compliance issues.

What are the limitations of automated web design compliance checks?▼

The limitations of automated web design compliance checks include the dependency on fetching guidelines from a specified URL. The audit cannot run without external rules to apply to the specified input files.

Related Skills

Explore More Design & Creative Skills→
riethmayerriethmayer
2

web-design-guidelines

Fetch Web Interface Guidelines and report UI code violations in file:line format.

Community
Intermediate
blackgirlbytesblackgirlbytes

audit-a11y

Audit React/Next.js components for WCAG 2.1 AA accessibility violations.

Community
Intermediate
dirnbauerdirnbauer
33

web-design-guidelines

Analyze frontend interfaces for accessibility, semantic HTML, and responsive design issues.

Community
Intermediate
AnvinX1AnvinX1

lint-and-validate

Run linting and static analysis on Python and Node.js projects.

Community
Intermediate