# UI UX Pro Max

UI/UX design intelligence with searchable database

- Repository: https://github.com/ZHangZHengEric/Sage (1219 stars)
- Category: Design
- License: MIT
- Last updated: 2026-10-30
- Runs scripts: yes, review before use

## Install

Claude Code: `npx skills add ZHangZHengEric/Sage --skill ui-ux-pro-max -g -a claude-code -y`
Codex: `npx skills add ZHangZHengEric/Sage --skill ui-ux-pro-max -g -a codex -y`
Cursor: `npx skills add ZHangZHengEric/Sage --skill ui-ux-pro-max -g -a cursor -y`
Gemini CLI: `npx skills add ZHangZHengEric/Sage --skill ui-ux-pro-max -g -a gemini-cli -y`

## Description

UI/UX design intelligence with searchable database

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# ui-ux-pro-max

Comprehensive design guide for web and mobile applications. Contains 67 styles, 96 color palettes, 57 font pairings, 99 UX guidelines, and 25 chart types across 13 technology stacks. Searchable database with priority-based recommendations.

## Prerequisites

Check if Python is installed:

```bash
python3 --version || python --version
```

If Python is not installed, install it based on user's OS:

**macOS:**
```bash
brew install python3
```

**Ubuntu/Debian:**
```bash
sudo apt update && sudo apt install python3
```

**Windows:**
```powershell
winget install Python.Python.3.12
```

---

## How to Use This Skill

When user requests UI/UX work (design, build, create, implement, review, fix, improve), follow this workflow:

### Step 1: Analyze User Requirements

Extract key information from user request:
- **Product type**: SaaS, e-commerce, portfolio, dashboard, landing page, etc.
- **Style keywords**: minimal, playful, professional, elegant, dark mode, etc.
- **Industry**: healthcare, fintech, gaming, education, etc.
- **Stack**: React, Vue, Next.js, or default to `html-tailwind`

### Step 2: Generate Design System (REQUIRED)

**Always start with `--design-system`** to get comprehensive recommendations with reasoning:

```bash
python3 skills/ui-ux-pro-max/scripts/search.py "<product_type> <industry> <keywords>" --design-system [-p "Project Name"]
```

This command:
1. Searches 5 domains in parallel (product, style, color, landing, typography)
2. Applies reasoning rules from `ui-reasoning.csv` to select best matches
3. Returns complete design system: pattern, style, colors, typography, effects
4. Includes anti-patterns to avoid

**Example:**
```bash
python3 skills/ui-ux-pro-max/scripts/search.py "beauty spa wellness service" --design-system -p "Serenity Spa"
```

### Step 2b: Persist Design System (Master + Overrides Pattern)

To save the design system for hierarchical retrieval across sessions, add `--persist`:

The rest: https://github.com/ZHangZHengEric/Sage/blob/HEAD/app/skills/ui-ux-pro-max/SKILL.md