ui-ux-pro-max

Searches local UI/UX datasets to generate design systems and implementation guidance.

Updated Aug 26, 2026
One-click install
npx skills add https://github.com/MohamadJoumaa/Direct --skill ui-ux-pro-max-mohamadjoumaa
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/MohamadJoumaa/Direct/tree/main/.cursor/skills/ui-ux-pro-max
Command: npx skills add https://github.com/MohamadJoumaa/Direct --skill ui-ux-pro-max-mohamadjoumaa

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve? Choosing styles, colors, fonts, and interaction patterns for a new interface often means scattered research and inconsistent decisions. This Skill provides a searchable local knowledge base of UI/UX styles, palettes, typography pairings, UX guidelines, icons, charts, GSAP motion presets, and stack-specific rules so design decisions come from one verified source. ## Core Features & Use Cases - Design System Generation: Run a --design-system query to get a complete visual direction (pattern, style, colors, typography, effects, anti-patterns) and persist it as a Master file plus per-page overrides for reuse across sessions. - Domain Searches: Query focused domains such as style, color, typography, ux, icons, chart, landing, gsap, react, and web for targeted guidance on a single concern. - Stack Guidelines: Retrieve implementation best practices for 22 stacks including React, Next.js, Vue, SwiftUI, Flutter, and Tailwind. - Use Case: When asked to build a fintech dashboard, run a design-system query for the overall direction, then search the chart domain for data visualization guidance and the nextjs stack for performance rules before writing code. ## Quick Start Ask the assistant to use the ui-ux-pro-max skill to generate a design system for your product, for example by requesting a modern minimal design system for an AI search homepage.

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 bundled search script with the --design-system flag and a query describing your product type, industry, and style keywords. The command aggregates product, style, color, landing, and typography matches into a complete design system with anti-patterns to avoid.

What design data can I search with this tool?

The local datasets cover 79 searchable styles, 192 product palettes and reasoning profiles, 74 font pairings, 119 UX guidelines, 105 curated icons, 17 GSAP motion presets, 25 chart types, and 22 stack guideline files. Each domain is queried with a focused keyword search.

Does the search script require any Python packages?

No third-party packages are needed. The scripts use only the Python 3 standard library and run fully offline with no network access. If Python is missing, the skill instructs the user to install it rather than installing it automatically.

Which frameworks and stacks are supported for implementation guidance?

Stack guidelines exist for 22 stacks including react, nextjs, vue, svelte, astro, angular, swiftui, react-native, flutter, html-tailwind, shadcn, jetpack-compose, javafx, and others. Use the --stack flag with a keyword to retrieve stack-specific rules.

How do I persist a design system across sessions?

Add --persist with --output-dir to the design-system command. It creates a MASTER.md file as the global source of truth plus optional per-page override files, so later pages inherit Master rules unless a page file overrides them.

What should I do when a search returns no useful results?

Retry once with a narrower query or an explicit domain or stack flag. If the retry still fails, the skill directs you to state that no verified match was found and use clearly labeled general guidance instead of persisting unverified output.