web-design-guidelines

Automate UI design compliance reviews against accessibility, UX, and design-system standards.

Updated Feb 7, 2026
One-click install
npx skills add https://github.com/chathuraed/existing_project --skill web-design-guidelines-chathuraed
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/chathuraed/existing_project/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/chathuraed/existing_project --skill web-design-guidelines-chathuraed

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams verify that UI code aligns with Web Interface Guidelines, ensuring accessibility, usability, and design-system consistency across projects.

Core Features & Use Cases

  • Accessibility & UX Compliance: automatically assess UI components against WCAG and UX best practices.
  • Design System Adherence: checks for consistent use of styles, tokens, and components.
  • Pre-Deployment UI Checks: runs checks on code before release and flags deviations.
  • Use Case: Example: a developer wants to audit a new component library for accessibility issues and design consistency.

Quick Start

Use the web-design-guidelines skill to review the latest UI components in your project by specifying the relevant files or patterns.

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

To audit UI code for accessibility and UX compliance, specify target files or patterns within your project. The tool reads the files, fetches latest rules, applies all guidelines, and outputs formatted results.

What is a UI design system adherence check?

A UI design system adherence check verifies consistent use of styles, tokens, and components across your project. It flags deviations from established design-system standards to maintain visual consistency.

Can I run pre-deployment UI checks on component libraries?

Yes, you can run pre-deployment UI checks on component libraries. The tool assesses components against WCAG, UX best practices, and design-system rules, flagging issues before release.

Does this accessibility audit require specific dependencies or components?

No specific dependencies or components are required to run this accessibility audit. The tool operates independently, fetching the latest rules from a remote source to evaluate target files.

When do I need a responsiveness pattern audit?

You need a responsiveness pattern audit when verifying UI code aligns with Web Interface Guidelines before deployment. It ensures usability and design-system consistency across different screen sizes and contexts.