skills.rest
JochenYang
JochenYangCOMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro-max

Generate UI/UX design systems with patterns, palettes, typography, and implementation notes.

21|3|Updated Jan 22, 2026
Search Tags:#design#tailwind#ui-ux#design-system#pattern-library#ai-assisted#multidomain
One-click install
npx skills add https://github.com/JochenYang/Jochen-ai-rules --skill ui-ux-pro-max-jochenyang
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/JochenYang/Jochen-ai-rules/tree/main/.claude/skills/ui-ux-pro-max
Command: npx skills add https://github.com/JochenYang/Jochen-ai-rules --skill ui-ux-pro-max-jochenyang

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

UI/UX designers and product teams struggle to build cohesive design systems that scale across products, stacks, and platforms without inconsistencies. This Skill automates the creation of comprehensive design systems by synthesizing guidance from multiple domains into a cohesive, actionable blueprint.

Core Features & Use Cases

  • Aggregates multi-domain design guidance to produce patterns, color palettes, typography recommendations, and implementation notes for web and mobile projects.
  • Generates pattern-laden design systems suitable for HTML/Tailwind, React, Next.js, Vue, Svelte, and other stacks.
  • Use case: design a SaaS dashboard with a consistent component library, accessible color system, and typography.

Quick Start

python3 .claude/skills/ui-ux-pro-max/scripts/design_system.py "SaaS dashboard" --design-system -p "Analytics Dashboard"

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 cohesive UI/UX design system for multiple frameworks like React and Vue?▼

To generate a cohesive UI/UX design system for React, Vue, or Svelte, this Skill synthesizes multi-domain guidance into actionable blueprints. It outputs patterns, color palettes, typography recommendations, and implementation notes formatted in Markdown or ASCII.

Can I build a Tailwind design system that includes accessible color palettes and typography?▼

Yes, you can build a Tailwind design system with accessible color palettes and typography. The Skill automates creating comprehensive design systems by aggregating multi-domain design guidance into a cohesive, actionable blueprint for web projects.

What is the best way to automate design system creation for a SaaS dashboard?▼

The best way to automate design system creation for a SaaS dashboard is running the provided Python script. It generates pattern-laden design systems suitable for your stack, delivering component libraries, accessible color systems, and typography rules.

Does this design system generator work with HTML and Next.js projects?▼

Yes, this design system generator works with HTML and Next.js projects. It applies multi-domain design intelligence across web and mobile stacks to deliver consistent UI patterns, color palettes, and typography recommendations.

What output format does the automated UI/UX design system use?▼

The automated UI/UX design system uses ASCII box or Markdown output formats. This satisfies formatting requirements while delivering selected UI patterns, design rules, project naming, and implementation notes directly for your web or mobile project.

Do I need any dependencies to run the UI/UX design system script?▼

No dependencies are required to run the UI/UX design system script. The Skill operates independently using its internal Python script to synthesize multi-domain design guidance into cohesive patterns and implementation notes.

Related Skills

Explore More Design & Creative Skills→
somachaksomachak

designing-component-systems

Establish a design-system blueprint for React/TypeScript UI components with prop APIs.

Community
Intermediate
hendripermanahendripermana

ui-ux-pro-max

Generate a structured design system with patterns, style rules, and palettes.

Community
Advanced
Jorge-IvanJorge-Ivan
1

generating-components

Generate and refine frontend UI components with Gemini Design MCP.

Community
Advanced
alexsandrocruzalexsandrocruz

ui-ux-pro-max

Generate UI/UX design system recommendations via multi-domain BM25 searches.

Community
Advanced