ui-ux-pro-max

Generate UI and UX design-system recommendations from curated CSV knowledge bases.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This Skill helps turn vague UI and UX requests into concrete design-system decisions, so product and interface work does not stall on style selection, color choices, typography, layout patterns, or platform-specific guidance.

Core Features & Use Cases

  • Design System Generation: Produces a full recommendation spanning layout pattern, style direction, color palette, typography, effects, and anti-patterns to avoid.
  • Targeted UX and UI Search: Searches curated datasets for product patterns, visual styles, color systems, chart choices, UX rules, icon guidance, and implementation best practices across supported stacks.
  • Persistent Design Guidance: Can save a master design system plus page-specific overrides for multi-page products that need consistent decisions across sessions.
  • Use Case: When building a new dashboard, landing page, mobile app screen, or reviewing an existing interface, use this Skill to pick an appropriate visual direction, validate UX quality, and retrieve stack-specific implementation guidance before coding.

Quick Start

Ask the AI to use the ui-ux-pro-max skill to generate a design system for your product type, audience, style keywords, and target stack, then refine it with domain-specific UX or color searches as needed.

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 complete UI UX design system for a new web or mobile product?

To generate a design system, provide your product type, audience, style keywords, and target stack. The system outputs layout patterns, color palettes, typography, visual effects, and anti-patterns to avoid for your digital product.

Can I get stack-specific frontend implementation guidance for dashboard and landing page components?

Yes, you can retrieve stack-specific frontend implementation guidance for dashboards and landing pages. It searches curated datasets to provide visual styles, UX rules, and best practices tailored to your supported web and mobile stacks.

What is the best way to maintain consistent UX rules and color palettes across multi-page applications?

The best way to maintain consistency is using persistent design guidance. It saves a master design system alongside page-specific overrides, ensuring consistent color palettes and UX rules across multi-page products and sessions.

Does this design system generation approach include accessibility checks and dark mode planning?

Yes, design system generation explicitly includes accessibility checks and dark mode planning. It validates UX quality and retrieves interface guidance to ensure your visual decisions meet accessibility standards across web and mobile scenarios.

How do I choose the right chart visualizations and icon guidance for my interface?

To choose chart visualizations and icon guidance, use targeted UX and UI search. It queries curated CSV knowledge bases using BM25 retrieval to return specific chart selections and icon implementation best practices for your interface.

Do I need Python search scripts to run UX validation and interface guidance queries?

Yes, Python search scripts are required to perform UX validation and retrieve interface guidance. The system relies on BM25 retrieval over curated CSV knowledge bases and YAML-defined skill activation to process visual decision requests.