An AI skill that provides design intelligence for building professional UI/UX across multiple platforms.
UI UX Pro Max Skill is a design intelligence layer that injects structured UI/UX reasoning directly into AI-assisted coding workflows, including Claude Code, Cursor, Windsurf, Kiro, and Copilot. It ships as a collection of 161 reasoning rules and 67 pre-defined UI styles that guide code generation toward professional design outcomes without requiring manual design decisions from the developer. The flagship feature in v2.0 is the Design System Generator, which analyzes a project description and outputs a complete, opinionated design system covering layout patterns, color palettes, typography pairings, interaction effects, and explicit anti-patterns to avoid. A CLI tool, uipro-cli, is available via npm for installation and project setup. The tool targets frontend developers and solo builders working with React, Tailwind CSS, HTML5, or mobile UI frameworks who want consistent, context-appropriate visual results, such as the demonstrated spa landing page that receives a full palette, font stack, and section structure recommendation automatically.
Claude/Codex skill providing UI/UX design intelligence, styles, palettes and component libraries for building pro UIs.
- ✓Open-source license (MIT)
- ✓Actively maintained (<30d)
- ✓Healthy fork ratio
- ✓Clear description
- ✓Topics declared
- ✓Documented (README)
git clone https://github.com/nextlevelbuilder/ui-ux-pro-max-skillTools overview
# [UI UX Pro Max](https://uupm.cc)
<p align="center">
<a href="https://github.com/nextlevelbuilder/ui-ux-pro-max-skill/blob/main/README.id.md">🇮🇩 Bahasa Indonesia</a> |
<a href="https://github.com/nextlevelbuilder/ui-ux-pro-max-skill/blob/main/README.ko.md">🇰🇷 한국어</a> |
<a href="https://github.com/nextlevelbuilder/ui-ux-pro-max-skill/blob/main/README.vi.md">🇻🇳 Tiếng Việt</a> |
<a href="https://github.com/nextlevelbuilder/ui-ux-pro-max-skill/blob/main/README.zh.md">🇨🇳 简体中文</a> |
<a href="https://github.com/nextlevelbuilder/ui-ux-pro-max-skill/blob/main/README.md">🇺🇸 English</a>
</p>
<p align="center">
<a href="https://github.com/nextlevelbuilder/ui-ux-pro-max-skill/releases"><img src="https://img.shields.io/github/v/release/nextlevelbuilder/ui-ux-pro-max-skill?style=for-the-badge&color=blue" alt="GitHub Release"></a>
<img src="https://img.shields.io/badge/reasoning_rules-192-green?style=for-the-badge" alt="192 Reasoning Rules">
<img src="https://img.shields.io/badge/UI_styles-79_searchable-purple?style=for-the-badge" alt="79 searchable UI styles">
<img src="https://img.shields.io/badge/python-3.x-yellow?style=for-the-badge&logo=python&logoColor=white" alt="Python 3.x">
<a href="https://github.com/nextlevelbuilder/ui-ux-pro-max-skill/blob/main/LICENSE"><img src="https://img.shields.io/github/license/nextlevelbuilder/ui-ux-pro-max-skill?style=for-the-badge&color=green" alt="License"></a>
</p>
<p align="center">
<a href="https://www.npmjs.com/package/ui-ux-pro-max-cli"><img src="https://img.shields.io/npm/v/ui-ux-pro-max-cli?style=flat-square&logo=npm&label=CLI" alt="npm"></a>
<a href="https://www.npmjs.com/package/ui-ux-pro-max-cli"><img src="https://img.shields.io/npm/dm/ui-ux-pro-max-cli?style=flat-square&label=downloads" alt="npm downloads"></a>
<a href="https://github.com/nextlevelbuilder/ui-ux-pro-max-skill/stargazers"><img src="https://img.shields.io/github/stars/nextlevelbuilder/ui-ux-pro-max-skill?style=flat-square&logo=github" alt="GitHub stars"></a>
<a href="https://paypal.me/uiuxpromax"><img src="https://img.shields.io/badge/PayPal-Support%20Development-00457C?style=flat-square&logo=paypal&logoColor=white" alt="PayPal"></a>
</p>
An AI skill that provides design intelligence for building professional UI/UX across multiple platforms and frameworks.
<p align="center">
<a href="https://uupm.cc">
<img src="screenshots/website.png" alt="UI UX Pro Max" width="800">
</a>
</p>
<p align="center">
<b>If you find this useful, consider supporting the project:</b><br><br>
<a href="https://paypal.me/uiuxpromax"><img src="https://img.shields.io/badge/PayPal-Donate-00457C?style=for-the-badge&logo=paypal&logoColor=white" alt="PayPal Donate"></a>
</p>
<p align="center">
<i>Other projects</i><br>
<a href="https://nextlevelbuilder.io">NextLevelBuilder.io</a> | <a href="https://goclaw.sh">GoClaw.sh</a> | <a href="https://agentkit.best">AgentKit.best</a> | <a href="https://tose.sh">TOSE.sh</a>
</p>
---
<p align="center">
<span>Check Out Our New Skill:</span>
<br/>
<a href="https://github.com/viettranx/3dviz-pro-max" target="_blank">
<picture>
<source media="(prefers-color-scheme: dark)" srcset="https://cdn.nextlevelbuilder.io/skills/3dviz/wordmark-dark.svg">
<img src="https://cdn.nextlevelbuilder.io/skills/3dviz/wordmark.svg" alt="3Dviz Pro Max" height="56">
</picture>
</a>
</p>
<p align="center"><b>Turn an idea into a 3D scene worth exploring.</b></p>
<p align="center">
<img src="https://cdn.nextlevelbuilder.io/skills/3dviz/harness-village.gif" width="800" alt="Harness Village: a fantasy village with camera navigation and animated creatures">
</p>
<p align="center">
<sub><b>Visual inspiration, not a benchmark.</b> An author-supplied project recorded <i>before</i> this skill existed; its UI contains Vietnamese. Historical footage, not an English demo or a runtime test of the skill — see <a href="https://github.com/viettranx/3dviz-pro-max/blob/main/docs/demos/README.md">media provenance</a>.</sub>
</p>
<p align="center">
🤌 Website: <a href="https://3dviz.dev/" target="_blank">https://3dviz.dev/</a>
</p>
---
## What's New in v2.0
### Intelligent Design System Generation
The flagship feature of v2.0 is the **Design System Generator** - an AI-powered reasoning engine that analyzes your project requirements and generates a complete, tailored design system in seconds.
```
+----------------------------------------------------------------------------------------+
| TARGET: Serenity Spa - RECOMMENDED DESIGN SYSTEM |
+----------------------------------------------------------------------------------------+
| |
| PATTERN: Hero-Centric + Social Proof |
| Conversion: Emotion-driven with trust elements |
| CTA: Above fold, repeated after testimonials |
| Sections: |
| 1. Hero |
| 2. Services |
| 3. Testimonials |
| 4. Booking |
| 5. Contact |
| |
| STYLE: Soft UI Evolution |
| Keywords: Soft shadows, subtle depth, calming, premium feel, organic shapes |
| Best For: Wellness, beauty, lifestyle brands, premium services |
| Performance: cost:low | Accessibility: risk:conditional; verify requirements |
| |
| COLORS: |
| Primary: #E8B4B8 (Soft Pink) |
| Secondary: #A8D5BA (Sage Green) |
| CTA: #D4AF37 (Gold) |
| Background: #FFF5F5 (Warm White) |
| Text: #2D3436 (Charcoal) |
| Notes: Calming palette with gold accents for luxury feel |
| |
| TYPOGRAPHY: Cormorant Garamond / Montserrat |
| Mood: Elegant, calming, sophisticated |
| Best For: Luxury brands, wellness, beauty, editorial |
| Google Fonts: https://fonts.google.com/share?selection.family=... |
| |
| KEY EFFECTS: |
| Soft shadows + Context-appropriate transitions + Gentle hover states |
| |
| AVOID (Anti-patterns): |
| Bright neon colors + Harsh animations + Dark mode + AI purple/pink gradients |
| |
| PRE-DELIVERY CHECKLIST: |
| [ ] No emojis as icons (use SVG: Heroicons/Lucide) |
| [ ] cursor-pointer on all clickable elements |
| [ ] Interaction timing follows the platform, component, and user preference |
| [ ] Light mode: text contrast 4.5:1 minimum |
| [ ] Focus states visible for keyboard nav |
| [ ] prefers-reduced-motion respected |
| [ ] Text, chips, and badges reflow without clipping or broken labels |
| [ ] Responsive: 375px, 768px, 1024px, 1440px |
| |
+----------------------------------------------------------------------------------------+
```
### How Design System Generation Works
```
┌─────────────────────────────────────────────────────────────────┐
│ 1. USER REQUEST │
│ "Build a landing page for my beauty spa" │
└─────────────────────────────────────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────────┐
│ 2. MULTI-DOMAIN SEARCH (5 parallel searches) │
│ • Product type matching (192 categories) │
│ • Style recommendations (79 searchable; 50 active) │
│ • Color palette selection (192 palettes) │
│ • Landing page patterns (34 patterns) │
│ • Typography pairing (74 font combinations) │
└─────────────────────────────────────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────────┐
│ 3. REASONING ENGINE What people ask about ui-ux-pro-max-skill
What is nextlevelbuilder/ui-ux-pro-max-skill?
+
nextlevelbuilder/ui-ux-pro-max-skill is tools for the Claude AI ecosystem. An AI skill that provides design intelligence for building professional UI/UX across multiple platforms. It has 126.7k GitHub stars and its last recorded update is dated 2026-09-10.
How do I install ui-ux-pro-max-skill?
+
You can install ui-ux-pro-max-skill by cloning the repository (https://github.com/nextlevelbuilder/ui-ux-pro-max-skill) or following the README instructions on GitHub. ClaudeWave also provides quick install blocks on this page.
Is nextlevelbuilder/ui-ux-pro-max-skill safe to use?
+
Our security agent has analyzed nextlevelbuilder/ui-ux-pro-max-skill and assigned a Trust Score of 100/100 (tier: Verified). See the full breakdown of passed checks and flags on this page.
Who maintains nextlevelbuilder/ui-ux-pro-max-skill?
+
nextlevelbuilder/ui-ux-pro-max-skill is maintained by nextlevelbuilder. The last recorded GitHub activity is dated 2026-09-10, with 84 open issues.
Are there alternatives to ui-ux-pro-max-skill?
+
Yes. On ClaudeWave you can browse similar tools at /categories/tools, sorted by popularity or recent activity.
Deploy ui-ux-pro-max-skill to your cloud
Ship this repo to production in minutes. Each platform spins up its own environment with editable env vars.
Maintain this repo? Add a badge to your README
Drop the badge into your GitHub README to show it's tracked on ClaudeWave. Each badge links back to this page and reflects the live Trust Score.
[](https://claudewave.com/repo/nextlevelbuilder-ui-ux-pro-max-skill)<a href="https://claudewave.com/repo/nextlevelbuilder-ui-ux-pro-max-skill"><img src="https://claudewave.com/api/badge/nextlevelbuilder-ui-ux-pro-max-skill" alt="Featured on ClaudeWave: nextlevelbuilder/ui-ux-pro-max-skill" width="320" height="64" /></a>More Tools
A single CLAUDE.md file to improve Claude Code behavior, derived from Andrej Karpathy's observations on LLM coding pitfalls.
🪨 why use many token when few token do trick — Claude Code skill that cuts 65% of tokens by talking like caveman
CLI proxy that reduces LLM token consumption by 60-90% on common dev commands. Single Rust binary, zero dependencies
The fastest, litest AI Gateway. Rust core with Python SDK. Call 100+ LLM APIs in OpenAI (or native) format with cost tracking, guardrails, load balancing, and logging [Bedrock, Azure, OpenAI, Anthropic, OpenAI, VertexAI, vLLM, Nvidia NIM]
Use Claude Code, Codex, Pi, and OpenCode and more for free (1.3B+ free tokens) from your terminal, app, IDE, or phone like OpenClaw (voice supported + ToS friendly)
A collection of notebooks/recipes showcasing some fun and effective ways of using Claude.