web-design-guidelines

Audit HTML, CSS, and JavaScript files against the Web Interface Guidelines.

1|Updated Mar 30, 2026
One-click install
npx skills add https://github.com/Typeless-Git/skills --skill web-design-guidelines-typeless-git
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/Typeless-Git/skills/tree/main/web-design-guidelines
Command: npx skills add https://github.com/Typeless-Git/skills --skill web-design-guidelines-typeless-git

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Audits web UI code to verify conformance with the Web Interface Guidelines, reducing accessibility gaps and design inconsistencies across projects.

Core Features & Use Cases

  • Guideline-driven review: Compare HTML, CSS, and JavaScript components against the latest Web Interface Guidelines to identify accessibility, visual design, and UX issues.
  • Component-level checks: Audit reusable widgets and templates for consistency and performance implications.
  • Use Case: A design system team runs a UI audit across multiple pages to ensure color contrast, keyboard navigability, and semantic HTML usage.

Quick Start

Run a UI review on the target codebase to validate accessibility and design compliance against the latest guidelines.

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

To audit web UI code for accessibility, evaluate HTML, CSS, and JavaScript assets against Web Interface Guidelines to identify conformance gaps and visual design issues. The process fetches the latest rules, reads target files, and emits concise findings in a file:line format.

What is a UI code conformance review and how does it work?

A UI code conformance review identifies accessibility and usability gaps by comparing HTML, CSS, and JavaScript components against established Web Interface Guidelines. It evaluates semantic HTML usage, visual design consistency, and keyboard navigability across reusable widgets and pages.

Can I check color contrast and keyboard navigability across multiple web pages?

Yes, you can check color contrast and keyboard navigability across multiple pages by running a component-level UI audit. This evaluates reusable widgets and templates against Web Interface Guidelines to ensure accessibility and UX consistency.

How do I review HTML, CSS, and JavaScript components for design system consistency?

Review HTML, CSS, and JavaScript components for design system consistency by applying guideline-driven rules to your codebase. This validates semantic HTML, visual design, and UX consistency across components, outputting specific findings in a file:line format.

Does this UI review process require any specific dependencies or frameworks?

No specific dependencies or framework limitations apply to this UI review process. It operates by fetching the latest Web Interface Guidelines from a specified source and reading target files or patterns directly from your web project to apply accessibility and visual design rules.

What format are accessibility and UX audit findings reported in?

Accessibility and UX audit findings are reported in a concise file:line format. This precisely maps each visual design, semantic HTML, or accessibility issue directly to the evaluated HTML, CSS, or JavaScript source line.