ui-ux-pro-max

Generates design system recommendations and searchable UI/UX guidelines via a BM25-based CLI.

Updated Jun 28, 2026
One-click install
npx skills add https://github.com/412181-HerediaLara/ScaffoldingBE-FE --skill ui-ux-pro-max-412181-heredialara
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/412181-HerediaLara/ScaffoldingBE-FE/tree/main/FE/.agents/skills/ui-ux-pro-max
Command: npx skills add https://github.com/412181-HerediaLara/ScaffoldingBE-FE --skill ui-ux-pro-max-412181-heredialara

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve? Choosing consistent styles, color palettes, typography, and UX patterns for web and mobile interfaces is time-consuming and error-prone. This Skill provides a searchable design knowledge base and an automated design system generator so UI decisions are grounded in curated data rather than guesswork. ## Core Features & Use Cases - Design System Generation: Run the search CLI with --design-system to get a complete recommendation covering pattern, style, colors, typography, effects, and anti-patterns for a given product type. - Domain Search: Query 11 domains (style, color, chart, landing, product, ux, typography, icons, react, web, google-fonts) plus 16 stack-specific guideline sets (React, Next.js, Vue, SwiftUI, Flutter, shadcn, and more) using BM25-ranked search over CSV data. - Persistence with Master + Overrides: Use --persist to save a design-system/MASTER.md file and optional per-page override files for hierarchical retrieval across sessions. - Use Case: When asked to build a fintech dashboard, run the design system generator to receive a recommended pattern, color tokens with CSS variables, font pairing, and a pre-delivery accessibility checklist before writing any component code. ## Quick Start Ask the AI to generate a design system for your product, for example: "Generate a design system for a beauty spa landing page using the ui-ux-pro-max search script."

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 new project?

Run the search script with the --design-system flag and a query describing your product, for example: python3 scripts/search.py "beauty spa wellness" --design-system -p "Serenity Spa". It returns a recommended pattern, style, color tokens, typography, effects, and anti-patterns.

What design domains can I search with this tool?

You can search 11 domains: style, color, chart, landing, product, ux, typography, icons, react, web, and google-fonts. Use --domain <name> with a keyword query, or omit it to let the tool auto-detect the most relevant domain.

Which frameworks and stacks are supported for guidelines?

Stack-specific guideline search covers 16 stacks including React, Next.js, Vue, Svelte, Astro, SwiftUI, React Native, Flutter, Nuxt, shadcn, HTML/Tailwind, Jetpack Compose, Three.js, Angular, and Laravel. Pass the stack name with the --stack flag.

Does the design system generator save results for later sessions?

Yes. Adding --persist writes a design-system/<project>/MASTER.md file as the global source of truth, and adding --page creates a page-specific override file under design-system/pages/ that takes priority over the master rules.

What are the requirements to run the search scripts?

Python 3 is the only requirement; the scripts use only the standard library (csv, json, re, pathlib). On Windows, invoke them with python instead of python3.

When should I not use this UI/UX design skill?

Skip it for pure backend logic, API or database design, infrastructure work, and non-visual automation tasks. It is intended only for work that changes how an interface looks, feels, moves, or is interacted with.