skills.rest
chiperman
chipermanCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-design-guidelines

Audit UI code files against Web Interface Guidelines.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams ensure UI code adheres to Web Interface Guidelines, preventing design drift and accessibility issues across projects.

Core Features & Use Cases

  • Guideline-driven review: Audits files against the latest Web Interface Guidelines source.
  • Automated checks on demand: Runs on specified code files or patterns during reviews or CI.
  • Use Case: When reviewing a new UI component, run this Skill to identify deviations from guidelines and propose fixes.

Quick Start

Use the web-design-guidelines skill to review the files 'src/components/Button/index.html' and 'src/styles/button.css' against the 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 UI code against web design guidelines?▼

To audit UI code against web design guidelines, specify the target files like HTML and CSS components. The skill evaluates these files against the official guidelines source, identifying compliance deviations and reporting findings in a structured format.

What is a UI code review for accessibility and design drift?▼

A UI code review for accessibility and design drift evaluates component files against established Web Interface Guidelines. It identifies non-compliant code patterns, preventing visual inconsistencies and accessibility issues across web projects and component libraries.

Can I run a design system audit on component libraries?▼

Yes, you can run a design system audit on component libraries. The skill applies rule checks to specific code files or patterns, making it suitable for reviewing new UI components within component libraries during standard code reviews.

How do I check web interface compliance for pull requests?▼

To check web interface compliance for pull requests, apply the skill to the modified UI files. It fetches the official guidelines, evaluates the specified code for adherence, and reports accessibility and UI deviations in the mandated format.

What's the best way to prevent design drift in web projects?▼

The best way to prevent design drift in web projects is to run automated guideline-driven audits on UI files. This skill compares code against the latest Web Interface Guidelines, catching inconsistencies and proposing fixes during code reviews.

Related Skills

Explore More Design & Creative Skills→
vijaykpatelvijaykpatel

web-design-guidelines

Analyze UI code and assets for Web Interface Guidelines compliance and report violations.

Community
Intermediate
cy-walicy-wali

brand-review

Review content against brand voice guidelines and propose fixes.

Community
Advanced
pradyumnasagarpradyumnasagar
6

agent-handoff

Automate inter-skill data transfer and provenance capture via JSON Material Passports.

Community
Advanced
mdnaimul22mdnaimul22
2

architecture-auditing-linter

Scan Python codebases for architecture and REST API violations.

Community
Advanced