web-design-guidelines

Identify and report UI code violations against the latest Web Interface Guidelines.

1|Updated Feb 9, 2026
One-click install
npx skills add https://github.com/blesstosam/trpc-fastify-starter --skill web-design-guidelines-blesstosam
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/blesstosam/trpc-fastify-starter/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/blesstosam/trpc-fastify-starter --skill web-design-guidelines-blesstosam

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams ensure UI code complies with the latest Web Interface Guidelines, surfacing accessibility, usability, and consistency issues early.

Core Features & Use Cases

  • Fetch the latest guidelines from a central source and keep reviews up to date.
  • Read specified UI files or patterns and apply all guideline rules for evaluation.
  • Output concise, actionable findings in a file:line format that integrates with existing review workflows.

Quick Start

Run a UI review against your project files using the guidelines and report all 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 front-end code for UI accessibility and layout consistency?

To audit front-end code for UI accessibility and layout consistency, this tool reads target UI files, fetches the latest Web Interface Guidelines, and applies all rules to report violations in a file:line format. It surfaces usability issues early in development.

What is a UI code audit against web design guidelines?

A UI code audit against web design guidelines programmatically reads front-end components to identify and report violations relative to the latest Web Interface Guidelines. It ensures accessibility, layout consistency, and UX best practices across web applications.

Can I use this tool to review specific web pages and component files?

Yes, you can use this tool to review specific web pages and component files. It is applicable to front-end codebases across web applications, allowing you to read specified UI files or patterns and evaluate them against all guideline rules.

How are UI guideline violations reported for integration with existing review workflows?

UI guideline violations are reported in a concise, actionable file:line format. This prescribed output structure allows developers to quickly locate and fix accessibility and consistency issues, integrating smoothly with existing front-end code review workflows.

How do I ensure my UI review uses the latest web interface guidelines?

To ensure your UI review uses the latest web interface guidelines, the tool programmatically fetches guideline rules from a central guidelines source. This keeps your front-end codebase evaluations and design reviews up to date automatically.