web-design-guidelines

Review UI code against Web Interface Guidelines and report compliance findings.

Updated Jan 24, 2026
One-click install
npx skills add https://github.com/PaulPio/FinFlow- --skill web-design-guidelines-paulpio
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/PaulPio/FinFlow-/tree/main/.gemini/skills/web-design-guidelines
Command: npx skills add https://github.com/PaulPio/FinFlow- --skill web-design-guidelines-paulpio

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps teams ensure their UI code complies with the latest Web Interface Guidelines, reducing accessibility gaps and UX issues.

Core Features & Use Cases

  • Guidelines Access: Fetches the most recent Web Interface Guidelines from the official source.
  • Code Review: Analyzes UI files across patterns or specific paths to identify accessibility, readability, and UX defects.
  • Use Case: Imagine you have a web app with multiple pages; use this skill to audit index.html, components, and styles to surface issues and propose fixes.

Quick Start

Provide UI files or a file pattern (e.g., 'src/**/*.tsx'). The skill fetches the latest guidelines, analyzes the provided files, and outputs a concise compliance report.

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 UI code for accessibility and UX compliance?

To audit UI code for accessibility and UX compliance, provide your web project files or a file pattern like 'src/**/*.tsx'. The tool fetches the latest Web Interface Guidelines, analyzes the files, and outputs a concise per-file findings report detailing defects and proposed fixes.

What is a UI guidelines compliance review and how does it work?

A UI guidelines compliance review analyzes web interface code against official standards to identify accessibility, readability, and UX defects. It works by fetching the latest guidelines from an official source and applying them to specified files to produce a concise per-file findings report.

Can I use this UX audit tool to review specific file patterns in my web app?

Yes, you can use this UX audit tool to review specific file patterns in your web app. You provide a pattern such as 'src/**/*.tsx' or specific paths, and it analyzes those UI files to surface accessibility gaps and UX issues.

Does this accessibility checker work with any web project file types?

This accessibility checker works with web project files like index.html, components, and styles. It applies to web projects, UI reviews, accessibility checks, UX audits, and site-wide validation scenarios by analyzing the provided files.

What is the best way to check my web design against official Web Interface Guidelines?

The best way to check web design against official Web Interface Guidelines is to use an automated audit tool that fetches the most recent standards from the official source and applies them directly to your codebase to surface issues and propose fixes.

What limitations should I expect when running a site-wide validation for accessibility?

When running site-wide validation for accessibility, expect a concise per-file findings report focusing on compliance with Web Interface Guidelines. The tool has a basic implementation depth, meaning it provides targeted issue identification and proposed fixes without deep architectural reasoning.