skills.rest
kshehadeh
kshehadehCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

web-design-guidelines

Reviews UI code compliance with Web Interface Guidelines, including accessibility and best practices.

Updated Dec 30, 2025
Search Tags:#design#ui#code review#accessibility#guidelines#ux
One-click install
npx skills add https://github.com/kshehadeh/prompt --skill web-design-guidelines-kshehadeh
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/kshehadeh/prompt/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/kshehadeh/prompt --skill web-design-guidelines-kshehadeh

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps ensure that web interface code adheres to established design and accessibility guidelines, improving the quality and consistency of user interfaces.

Core Features & Use Cases

  • UI Code Review: Automatically checks UI code against a set of predefined web interface guidelines.
  • Accessibility Auditing: Identifies potential accessibility issues within the code.
  • Best Practice Compliance: Verifies adherence to general web development best practices.
  • Use Case: A developer can use this skill to audit a new component's code before merging to ensure it meets the project's design system and accessibility requirements.

Quick Start

Use the web-design-guidelines skill to review the file 'src/components/Button.tsx'.

Frequently Asked Questions about web-design-guidelines

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I check my UI code for accessibility and design best practices?▼

To check UI code for accessibility and design best practices, you can run an automated review against established web interface guidelines. This audits front-end components to identify compliance issues before merging.

Can I automatically review front-end components for web interface guideline compliance?▼

Yes, automated reviews can check front-end components for web interface guideline compliance. The skill evaluates UI code against predefined rules to ensure accessibility and design consistency.

How does an automated accessibility audit work for UI code?▼

An automated accessibility audit parses UI code and compares it against established guidelines to detect violations. It fetches the latest rules from a specified URL to ensure up-to-date design and accessibility checks.

Do I need a specific URL to review UI code against web design guidelines?▼

Yes, you need a specified URL to provide the latest web interface guidelines for the review. The skill fetches rules from this location to ensure up-to-date accessibility and design best practice application.

What is the best way to ensure a new component meets design system requirements?▼

The best way to ensure a component meets design system requirements is auditing its code against web interface guidelines. This verifies accessibility and best practice compliance before merging.

Related Skills

Explore More Software Engineering Skills→
mengxi-reammengxi-ream
9.0k

web-design-guidelines

Fetch Web Interface Guidelines and review UI code for compliance.

Community
Intermediate
hwj123hwjhwj123hwj
4

web-design-guidelines

Review UI code for compliance with the Web Interface Guidelines.

Community
Intermediate
gabriellpequenogabriellpequeno
8

web-design-guidelines

Enforce external UI guideline compliance during front-end design reviews and critiques.

Community
Basic
yono92yono92

web-design-guidelines

Fetch latest Web Interface Guidelines and review UI code for compliance.

Community
Intermediate