skills.rest
pohlai88
pohlai88COMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

Analyze HTML, CSS, and JavaScript UI files against current Web Interface Guidelines.

Updated Apr 5, 2026
Search Tags:#consistency#accessibility#frontend#patterns#web-design#design-review#ui-guidelines
One-click install
npx skills add https://github.com/pohlai88/afenda-vite-react --skill web-design-guidelines-pohlai88
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/pohlai88/afenda-vite-react/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/pohlai88/afenda-vite-react --skill web-design-guidelines-pohlai88

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps ensure UI code adheres to Web Interface Guidelines by fetching current guidelines and evaluating files for accessibility, consistency, and design quality.

Core Features & Use Cases

  • Fetches current guidelines from a trusted source.
  • Analyzes HTML/CSS/JS assets, components, and design tokens for alignment with guidelines.
  • Produces actionable recommendations for accessibility, performance, and design consistency.

Quick Start

Provide the UI files or patterns you want reviewed and run the review to receive a guideline-aligned 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 UI code against web interface guidelines for accessibility and consistency?▼

To audit UI code against web interface guidelines, provide your HTML, CSS, and JavaScript assets for analysis. The review evaluates design tokens and component libraries to identify accessibility, performance, and consistency issues, outputting actionable findings.

What is the best way to check if my frontend patterns align with current web design guidelines?▼

Checking frontend pattern alignment with web design guidelines involves fetching current standards and evaluating your UI files. The analysis scopes component libraries and design tokens to produce a structured report detailing design review findings.

Can I review design tokens and component libraries for UI consistency automatically?▼

You can review design tokens and component libraries for UI consistency automatically by supplying them to the evaluation process. The analysis checks these assets against established web interface guidelines to output findings in a concise file:line format.

Does the design review output structured reports suitable for fixing accessibility issues?▼

The design review does output structured reports suitable for fixing accessibility issues. It analyzes your UI assets and delivers actionable recommendations in a concise file:line format or a comprehensive report aligned with current web interface guidelines.

What do I need to provide to run a web design review on my project?▼

To run a web design review, you need to provide the UI files or patterns you want evaluated. The system analyzes these HTML, CSS, and JavaScript assets against fetched guidelines to deliver a report on accessibility and design quality.

Related Skills

Explore More Design & Creative Skills→
aidanadenaidanaden

web-design-guidelines

Identify UI design guideline violations in HTML, CSS, and JS files.

Community
Intermediate
childrentimechildrentime
1.0k

audit

Audit frontend components for accessibility, performance, theming, and responsive-design issues.

Community
Advanced
veerababumanyamveerababumanyam

frontend-design

Generate production-grade frontend interfaces with design-system tokens and reusable components.

Community
Basic
jubscodesjubscodes
49

gsp-project-critique

Run parallel design and accessibility audits for GSP projects.

Community
Advanced