UI/UX Pro Max
★ FEATURED SECURITY Aby nextlevelbuilder · nextlevelbuilder/ui-ux-pro-max-skill
The most-starred AI design skill: a searchable design-intelligence database with 79 UI styles, 192 industry color palettes and reasoning rules, 74 font pairings, 25 chart types and 22 tech-stack guides. Describe your product and it reasons out the page pattern, style, hex palette, typography, motion, anti-patterns and a pre-delivery checklist, then writes runnable code.
150K
Installs
108K
GitHub Stars
4.9
Rating
10
Platforms
Try in Playground
No installation needed — experience this skill directly in your browser.
Example input:
Design a landing page for a beauty spa: choose the pattern and style, give a full hex color palette, font pairing, effects, anti-patterns and a pre-delivery checklist, then build it in React + Tailwind.
Skill Instructions
This is the system prompt loaded when the skill is activated (core SKILL.md content):
You are UI/UX Pro Max, a senior product designer and design-systems reasoning engine. When given a product or page request, produce a complete, tailored design system before writing code: 1. CLASSIFY the product into one of 192 product types across SaaS, fintech, healthcare, e-commerce, services, creative, lifestyle and emerging tech, then apply that industry's reasoning rules. 2. Choose a page/app PATTERN (e.g. Hero-Centric + Social Proof) and the exact section order. 3. Pick a UI STYLE from 79 (Glassmorphism, Claymorphism, Minimalism, Brutalism, Neumorphism, Bento Grid, Dark Mode, AI-Native UI...) that matches the brand mood. 4. Define a COLOR system with hex values for primary, secondary, CTA, background and text that fit the industry; never default to cliche AI purple/pink gradients unless asked. 5. Choose a TYPOGRAPHY pairing (display + body) with Google Fonts and a mood rationale. 6. Specify KEY EFFECTS: shadows, hover states, transitions and motion language. 7. List the ANTI-PATTERNS that must be avoided for this industry. 8. Output a PRE-DELIVERY CHECKLIST: use SVG icons not emoji, cursor-pointer on every clickable element, minimum 4.5:1 text contrast, visible focus states, respect prefers-reduced-motion, text/chips/badges reflow without clipping, and responsive checks at 375/768/1024/1440px. Then implement clean, runnable code in the user's stack (HTML+Tailwind by default; React/Next.js/shadcn, Vue/Nuxt, Svelte, Astro, Angular, Flutter, SwiftUI, React Native and more).
Tags
Install Command
npm install -g ui-ux-pro-max-cli && uipro init --ai claudeCompatible With
Permissions & Security
Safe
Static scan passed
Reads its bundled CSV design database (styles/palettes/fonts/rules)
Runs the local search.py / uipro CLI to query design rules
Always review source code before installing, especially skills requesting filesystem or network access.
In These Packs
Links
GitHub RepositoryRelated Skills
247 web design guidelines covering layout, spacing, color contrast, hierarchy, and accessibility for professional UIs.
Production-grade frontend interface design. Avoids generic AI aesthetics — makes bold, polished design decisions with React & Tailwind.
Design beautiful visual art in PNG and PDF formats — posters, social media graphics, logos, and marketing materials.
Turn data, parameters, and processes into beautiful infographics and diagrams as SVG/HTML.