skills.rest
Clay-HHK
Clay-HHKCOMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro-max

Generate design systems and UI/UX guidance for web and mobile interfaces.

2|Updated Apr 12, 2026
Search Tags:#typography#accessibility#react#tailwind#ui-ux#design-system#style-guidelines
One-click install
npx skills add https://github.com/Clay-HHK/claude-config --skill ui-ux-pro-max-clay-hhk
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/Clay-HHK/claude-config/tree/main/skills/ui-ux-pro-max
Command: npx skills add https://github.com/Clay-HHK/claude-config --skill ui-ux-pro-max-clay-hhk

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

UI/UX Pro Max reduces the friction of designing and implementing consistent, accessible, and production-ready user interfaces by providing a prioritized rule set, ready-made style choices, and a reproducible design-system workflow so teams can move from concept to code faster and with fewer UX regressions.

Core Features & Use Cases

  • Design system generation: Produces a complete design system (patterns, styles, colors, typography, anti-patterns) tailored to the product type and style keywords.
  • Stack-aware implementation guidance: Offers practical implementation notes for html-tailwind by default and support for React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, and shadcn/ui.
  • Searchable recommendations & persistence: Executes scripted searches to recommend palettes, font pairings, and components and can persist a MASTER design-system with page-level overrides for hierarchical retrieval.
  • Use Case: For a SaaS dashboard redesign, run a design-system generation, apply accessibility-first rules, and export patterns and page overrides for implementation in your chosen stack.

Quick Start

Create a complete design system for a SaaS dashboard using minimalism, accessible high-contrast colors, and Tailwind-ready implementation.

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 generate a design system with accessible typography and color palettes for a web interface?▼

You can generate a complete design system by specifying your product type and style keywords. It produces accessible typography pairings, high-contrast color palettes, and component patterns tailored for web and mobile interfaces.

Can I get UI component implementation guidance for React, Next.js, or Vue?▼

Yes, it provides stack-aware implementation notes for React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, and shadcn/ui. HTML with Tailwind is the default output for generated UI component guidance.

What is the best way to run an accessibility audit on my SaaS dashboard design?▼

The best way to run an accessibility audit is to apply its prioritized accessibility-first rules to your dashboard design. It evaluates contrast, component design, and UX patterns to identify and resolve accessibility regressions.

Does this design system workflow support page-level overrides for hierarchical retrieval?▼

Yes, the workflow supports page-level overrides. It persists a MASTER design-system file that allows you to apply specific style guidelines and hierarchical retrievals for individual pages within a larger application.

How do I select font pairings and avoid anti-patterns when building a UI style guideline?▼

It executes scripted searches to recommend font pairings and defines explicit anti-patterns within the generated style guidelines. This ensures your UI remains consistent and avoids common typographical and layout regressions.

Related Skills

Explore More Design & Creative Skills→
koki3141koki3141
2

ui-ux-pro-max

Generate design systems for UI/UX projects using Python scripts.

Community
Advanced
hbn0729hbn0729
1

ui-ux-pro-max

Generate a UI/UX design system with patterns, styles, colors, and typography.

Community
Advanced
anicdhanicdh

frontend-ui

Apply Tailwind and Shadcn/ui patterns with accessibility rules to React components.

Community
Advanced
ArogyaReddyArogyaReddy

visual-design-foundations

Define typography, color, spacing, and iconography design tokens for web and mobile UI.

Community
Advanced