Ui Ux Pro Max Skill

# UI UX Pro Max Skill

> Skill by [ara.so](https://ara.so) — Daily 2026 Skills collection.

UI UX Pro Max is an AI skill that injects design intelligence into coding agents — giving them 161 industry-specific reasoning rules, 67 UI styles, 57 font pairings, 161 color palettes, and pre-delivery checklists to produce professional, accessible, conversion-optimized interfaces on the first attempt.

## Installation

### Via CLI (Recommended)

```bash
# Install the CLI globally
npm install -g uipro-cli

# Add the skill to your project
npx uipro-cli install

# Or install globally
npx uipro-cli install --global
```

### Via Python (Direct)

```bash
# Clone the repository
git clone https://github.com/nextlevelbuilder/ui-ux-pro-max-skill.git
cd ui-ux-pro-max-skill

# Install dependencies
pip install -r requirements.txt

# Run the design system generator
python main.py
```

### Manual SKILL.md Integration

Copy the generated `SKILL.md` into your project root so agents like Claude Code, Cursor, Codex, or Windsurf automatically pick it up:

```bash
cp SKILL.md /your-project/SKILL.md
```

---

## Core Concepts

### Design System Generator

When you describe a product, the skill runs a multi-domain search across:

| Domain | Count | Purpose |
|--------|-------|---------|
| Reasoning Rules | 161 | Industry-specific layout/style decisions |
| UI Styles | 67 | Visual language (Glassmorphism, Brutalism, etc.) |
| Color Palettes | 161 | Industry-matched palettes |
| Font Pairings | 57 | Typography combinations |
| Landing Page Patterns | 24 | Conversion-optimized structures |

### Output: Complete Design System

Every generation produces:
- **Pattern** — Page structure (sections, CTA placement)
- **Style** — Visual language with keywords
- **Colors** — Primary, secondary, CTA, background, text
- **Typography** — Font pairing + Google Fonts URL
- **Key Effects** — Animations and interactions
- **Anti-Patterns** — What to avoid for this industry
- **Pre-Delivery Checklist** — Accessibility and UX gates

---

## Python API Usage

### Basic Design System Generation

```python
from uiuxpro import DesignSystemGenerator

# Initialize the generator
generator = DesignSystemGenerator()

# Generate a complete design system from a description
result = generator.generate(
    description="A landing page for a luxury beauty spa",
    stack="react",           # react | nextjs | astro | vue | html
    mode="light"             # light | dark | auto
)

print(result.pattern)        # Landing page structure
print(result.style)          # UI style recommendation
print(result.colors)         # Color palette dict
print(result.typography)     # Font pairing + import URL
print(result.effects)        # Animations and interactions
print(result.anti_patterns)  # What to avoid
print(result.checklist)      # Pre-delivery gates
```

### Query Reasoning Rules

```python
from uiuxpro import ReasoningEngine

engine = ReasoningEngine()

# Find rules for a product type
rules = engine.search("fintech payment app")
for rule in rules:
    print(rule.category)       # e.g. "Fintech/Crypto"
    print(rule.pattern)        # Recommended page pattern
    print(rule.style_priority) # Ordered list of styles
    print(rule.color_mood)     # Palette keywords
    print(rule.anti_patterns)  # e.g. ["playful fonts", "neon colors"]

# Get all rules for a category
all_healthcare = engine.get_by_category("Healthcare")
```

### Style Lookup

```python
from uiuxpro import StyleLibrary

styles = StyleLibrary()

# Get all 67 styles
all_styles = sty