web-design-guidelines

Review UI code for Web Interface Guidelines compliance and accessibility.

7|Updated Dec 7, 2025
One-click install
npx skills add https://github.com/ftzi/livespec --skill web-design-guidelines-ftzi
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/ftzi/livespec/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/ftzi/livespec --skill web-design-guidelines-ftzi

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, accessibility, and overall design quality.

Core Features & Use Cases

  • Automated Compliance Checking: Reviews UI code against a predefined set of web design best practices and accessibility standards.
  • Guideline Fetching: Automatically retrieves the latest guidelines from a specified source to ensure checks are up-to-date.
  • Use Case: When developing a new feature, use this Skill to audit the UI code for accessibility issues and adherence to design system rules before deployment.

Quick Start

Use the web-design-guidelines skill to review the UI code in the src/components directory.

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 accessibility and web design compliance?

Automated compliance checking reviews your UI code against predefined web design best practices and accessibility standards. It fetches external guidelines and analyzes specified file patterns to ensure your front-end meets established design rules.

What's the best way to automate web design guideline reviews in front-end workflows?

Automating web design guideline reviews involves fetching external standards and analyzing your front-end file patterns. This ensures your UI code consistently adheres to up-to-date accessibility and design best practices without manual intervention.

Do I need external guidelines to audit UI code for design best practices?

Yes, fetching external guidelines is required to audit UI code effectively. The review process retrieves the latest web interface standards from a specified source to ensure your accessibility and design checks are current and accurate.

Can I review specific file patterns like src/components for web standards?

Yes, you can review specific file patterns like src/components for web standards. The skill analyzes the UI code within your specified directories to ensure it meets established accessibility and web interface guideline requirements.

How does fetching the latest web interface guidelines improve code review?

Fetching the latest web interface guidelines improves code review by automatically retrieving current standards from a specified source. This ensures your UI code is always audited against the most recent accessibility and design best practices.

When should I run an accessibility and design audit on my UI code?

You should run an accessibility and design audit on your UI code when developing a new feature. Auditing front-end files for compliance with web interface guidelines before deployment prevents accessibility issues and ensures adherence to design system rules.