ui-ux-pro-max

Generates design system recommendations by searching UI/UX style, color, and typography databases.

Updated Jun 30, 2026
One-click install
npx skills add https://github.com/ayofemiade/cleva --skill ui-ux-pro-max-ayofemiade
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/ayofemiade/cleva/tree/main/.claude/skills/ui-ux-pro-max
Command: npx skills add https://github.com/ayofemiade/cleva --skill ui-ux-pro-max-ayofemiade

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve? Choosing coherent styles, color palettes, fonts, and layout patterns for a new web or mobile UI is time-consuming and often produces inconsistent results. This Skill provides a searchable design intelligence database that returns complete, reasoned design system recommendations for any product type. ## Core Features & Use Cases - Design System Generation: Run a single query to get a full design system covering page pattern, style, color palette, typography, effects, and anti-patterns, with optional persistence to a MASTER.md plus per-page override files. - Domain-Specific Search: Query 10 domains (style, color, typography, chart, landing, product, UX, icons, React performance, web interface) via a BM25 search engine over CSV datasets. - Stack Guidelines: Retrieve implementation best practices for 13 stacks including html-tailwind, React, Next.js, Vue, Svelte, SwiftUI, Flutter, and shadcn. - Use Case: When asked to build a landing page for a beauty spa, generate a design system with elegant styling, soft color palette, and serif font pairings, then pull Tailwind-specific layout and accessibility guidelines before writing code. ## Quick Start Ask the AI to generate a design system for your project, for example: create a landing page for a fintech dashboard using the ui-ux-pro-max design recommendations.

Frequently Asked Questions about ui-ux-pro-max

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate a design system for a web app?▼

Run the search script with the --design-system flag and a query describing your product, such as "beauty spa wellness service". It searches product, style, color, landing, and typography domains in parallel and returns a complete recommendation with pattern, colors, fonts, effects, and anti-patterns.

What design styles and color palettes are available?▼

The database contains 67 UI styles, 96 color palettes, 57 font pairings, 99 UX guidelines, and 25 chart types. You can search specific domains like style, color, or typography with keywords such as glassmorphism, minimalism, or elegant luxury.

Which frameworks and stacks are supported?▼

Stack-specific guidelines cover html-tailwind (default), React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, shadcn, and Jetpack Compose. Use the --stack flag with a keyword query to get implementation best practices for your chosen stack.

Can I save the design system for use across sessions?▼

Yes, add the --persist flag to write the design system to a design-system folder with a MASTER.md global rules file. Use --page to create page-specific override files that take precedence over the master file when building individual pages.

Does the search script require external Python packages?▼

No, the scripts use only Python standard library modules like csv, re, math, and pathlib. You only need Python 3 installed; no pip installs are required to run the BM25 search or design system generator.