ui-ux-pro-max

Standardizes UI/UX design quality across web and mobile projects with accessibility audits and responsive behavior.

Updated Aug 17, 2025

Search Tags:#ui #accessibility #components #ux #design-system #responsive-design #design-guidelines

Ready to run

npx skills add https://github.com/gzyxds/cloudcvm.com --skill ui-ux-pro-max-gzyxds

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/gzyxds/cloudcvm.com/tree/main/.trae/skills/ui-ux-pro-max
Command: npx skills add https://github.com/gzyxds/cloudcvm.com --skill ui-ux-pro-max-gzyxds

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Designers and teams struggle to maintain visual consistency, accessibility, and efficient design workflows across web and mobile apps.

Core Features & Use Cases

Comprehensive design guidance: typography, color tokens, spacing scales, layout rules, and responsive patterns for React, Next.js, Vue, Tailwind, and shadcn/ui.
Design system governance: 161 color palettes, 57 font pairings, 161 product types with reasoning rules, and 99 UX guidelines to inform decisions and maintain brand alignment.
Use Case: When delivering a new SaaS dashboard, generate a cohesive UI spec, component variants, and accessibility checks ready for implementation.

Quick Start

Define a cohesive UI spec for a new dashboard, covering layout, typography, color, and components.

Frequently Asked Questions about ui-ux-pro-max

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

FAQPage Schema

How do I standardize UI design quality and ensure accessibility across web and mobile projects?▼

You can audit accessibility and standardize UI design quality by applying standardized typography, color tokens, spacing rules, and responsive behavior checks to your web and mobile components, ensuring consistent visuals and scalable design governance.

How do I generate a cohesive UI spec with component variants for a SaaS dashboard?▼

Generate a cohesive UI spec for a SaaS dashboard by defining layout, typography, color, and component variants using predefined design rules. This includes applying 161 color palettes and 57 font pairings to ensure brand alignment and visual consistency.

Can I use this design system guidance with React, Next.js, Vue, and Tailwind?▼

Yes, the design guidance explicitly supports React, Next.js, Vue, Tailwind, and shadcn/ui by providing tailored layout rules, responsive patterns, and component guidelines to maintain visual consistency during implementation.

What is included in a design system governance review for web applications?▼

A design system governance review includes accessibility audits, responsive behavior validation, and interaction pattern checks. It leverages 99 UX guidelines and 161 product types with reasoning rules to inform decisions, maintain brand alignment, and generate reviewer notes.

What's the best way to maintain visual consistency across a component library?▼

Maintain visual consistency across a component library by applying standardized spacing scales, color tokens, and typography rules. Using predefined design guidelines ensures all component variants adhere to a unified visual language and accessibility standards.

Why does my design system struggle with responsive behavior and accessibility across different breakpoints?▼

Your design system likely lacks defined responsive patterns and accessibility audits. Establishing standardized breakpoints, spacing rules, and interaction patterns ensures consistent responsive behavior and accessibility compliance across all web and mobile projects.