ui-ux-pro-max

Search a local UI/UX design database to generate design systems and guidelines.

Updated Jul 26, 2026
One-click install
npx skills add https://github.com/Dhruv-Ghanchi/Portfolio-Webiste --skill ui-ux-pro-max-dhruv-ghanchi
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/Dhruv-Ghanchi/Portfolio-Webiste/tree/main/.agents/skills/ui-ux-pro-max
Command: npx skills add https://github.com/Dhruv-Ghanchi/Portfolio-Webiste --skill ui-ux-pro-max-dhruv-ghanchi

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve? Choosing styles, color palettes, typography, and UX patterns for a new page or app often relies on guesswork. This Skill provides a searchable local database of UI/UX design rules so design decisions are grounded in curated data rather than ad-hoc choices. ## Core Features & Use Cases - Design System Generation: Run a single query to get a full recommendation covering layout pattern, style, color palette, typography, effects, and anti-patterns, with optional persistence to a MASTER.md file plus per-page overrides. - Domain-Specific Search: Query 12 domains (style, color, typography, chart, landing, product, ux, icons, gsap, react, web, google-fonts) via a BM25 search engine over CSV data, plus stack-specific guidelines for 22 frameworks including React, Next.js, Flutter, and SwiftUI. - Design Dials: Tune output with 1-10 variance, motion, and density sliders that bias style selection, attach GSAP motion snippets, and override spacing scales. - Use Case: When asked to build a SaaS dashboard in Next.js, generate a persisted design system, supplement it with UX and chart searches, then apply Next.js-specific stack guidelines before implementing. ## Quick Start Ask the AI to design a new page or component, for example: "Design a modern landing page for a fitness app using the ui-ux-pro-max design system workflow."

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 web page?

Run the search script with the --design-system flag and a query describing your product, industry, and tone. It searches product, style, color, landing, and typography domains in parallel and returns a pattern, palette, fonts, effects, and anti-patterns.

What design data does the UI/UX search database contain?

The database includes 84 styles, 192 color palettes, 74 font pairings, 192 product types, 98 UX guidelines, 104 icon entries, 16 GSAP motion presets, and 25 chart types. It also covers stack-specific guidelines for 22 frameworks.

Does the search tool require external Python packages?

No, the search script requires only Python 3 with no external dependencies. It implements BM25 ranking using the standard library and reads local CSV data files.

Which frameworks and stacks are supported for guidelines?

Stack-specific guidelines exist for React, Next.js, Vue, Nuxt, Svelte, Astro, Angular, Laravel, SwiftUI, React Native, Flutter, Jetpack Compose, Tailwind, shadcn/ui, Three.js, and several desktop UI frameworks. Pass the stack with the --stack flag.

What should I do when a design search returns zero results?

Retry once with broader or differently worded keywords, splitting product and style terms. If still empty, fall back to the built-in priority table defaults and state explicitly that no database match was found.

How do I persist a design system across sessions?

Add --persist with --output-dir pointing at the project root to create a design-system folder containing a MASTER.md source of truth and optional per-page override files. Existing MASTER.md files are skipped unless --force is passed.