ui-ux-pro-max-skill
ui-ux-pro-max-skill — an installable skill for AI agents.
By reason-machines · 1,983 installs
npx skills add reason-machines/trending-skills --skill ui-ux-pro-max-skill
Source repository · Upstream listing
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)
Via Python (Direct)
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:
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
Query Reasoning Rules
Style Lookup
Color Palette Selection
Typography Pairing
CLI Commands
Real World Examples
Example 1: React SaaS Dashboard
Generated Tailwind config from ds.tailwind config :
Example 2: Wellness/Spa Landing Page
Output ds.css variables :
Example 3: Fintech/Banking App
Example 4: Full Stack Integration with Next.js
Supported Tech Stacks
Stack Key Notes
React react Component patterns + Tailwind
Next.js nextjs App Router + RSC aware
Astro astro Island architecture patterns
Vue 3 vue Composition API patterns
Nuxt.js nuxt Auto imports aware
Nuxt UI nuxt ui Component overrides
Svelte svelte Reactive store patterns
SwiftUI swiftui iOS/macOS native patterns
React Native react native Mobile first responsive
Flutter flutter Widget tree patterns
HTML + Tailwind html Standalone CSS output
shadcn/ui shadcn Theme token overrides
Jetpack Compose jetpack Android Material3
Pre Delivery Checklist (Universal)
The skill enforces these gates on every generated design:
Common Patterns by Industry
Tech / SaaS
Style : Glassmorphism, Bento Grid, AI Native UI
Colors : Indigo/Violet primary, dark backgrounds for dashboards
Avoid : Stock photos, clip art, rainbow gradients
E commerce / Luxury
Style : Minimalism, Editorial, Claymorphism (for casual)
Colors : Black/Gold for luxury; bright/bold for casual
Avoid : Cluttered layouts, too many CTAs, Comic Sans adjacent fonts
Healthcare / Medical
Style : Clean Minimalism, Soft UI
Colors : Blues, teals, whites — clinical but warm
Avoid : Red for primary actions (emergency connotation), dark mode on medical data
Finance / Fintech
Style : Professional Minimalism, Data Dense UI
Colors : Deep blues, greens, neutrals
Avoid : Playful fonts, neon colors, AI purple gradients, excessive motion
Food & Restaurant
Style : Warm Minimalism, Photography Forward
Colors : Warm neutrals, appetizing reds/oranges, earthy tones
Avoid : Cold blues as primary, low contrast text over food photos
Troubleshooting
CLI not found after install
Python import errors
Generation returns generic output
Be specific in your description: include industry, audience, and goal
✗ "a website" → ✓ "a SaaS landing page for a B2B project management tool targeting remote engineering teams"
Include stack context for framework specific exports
No matching reasoning rule found
Tailwind config conflicts with existing config
Resources
Homepage : https://uupm.cc
GitHub : https://github.com/nextlevelbuilder/ui ux pro max skill
npm CLI : https://www.npmjs.com/package/uipro cli
License : MIT