ui-ux-pro-max

Generate design systems and UI/UX guidance across web and mobile stacks.

Updated Nov 11, 2025
One-click install
npx skills add https://github.com/codexyzdev/codexyz --skill ui-ux-pro-max-codexyzdev
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/codexyzdev/codexyz/tree/main/.trae/skills/ui-ux-pro-max
Command: npx skills add https://github.com/codexyzdev/codexyz --skill ui-ux-pro-max-codexyzdev

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This skill provides a design-system powered UI/UX guidance and automation for building cohesive interfaces.

Core Features & Use Cases

  • Comprehensive design guidelines across 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui)
  • 50+ styles, 97 color palettes, 57 font pairings, 99 UX guidelines, and 25 chart types
  • Actionable guidance for accessibility, layout, typography, spacing, and interaction patterns
  • Use cases include designing landing pages, dashboards, admin panels, and mobile apps with consistent UI

Quick Start

Example command to generate a complete design system: python3 skills/ui-ux-pro-max/scripts/search.py "<product_type> <industry> <keywords>" --design-system

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 design system for my web project?

To generate a complete design system, provide your product type, industry, and keywords to the scripted search tool. This produces a master design system with color palettes, font pairings, and UX guidelines for cohesive web interfaces.

Can I get UI and UX guidance for mobile apps using React Native and Flutter?

Yes, UI and UX guidance supports mobile app development across React Native and Flutter. It provides actionable component patterns, spacing, and interaction guidelines to ensure consistent mobile interfaces.

What typography and color palettes are available for building a UI design system?

The UI design system includes 97 color palettes and 57 font pairings. These options enable precise typography and color decisions to establish a cohesive visual language for your project.

Does this design system tool provide accessibility guidelines for interface development?

Yes, the design system tool provides actionable accessibility guidelines for interface development. It covers multiple accessibility scenarios across web and mobile projects to ensure usable interaction patterns.

What is the best way to maintain consistent UI components across different frameworks like Vue and Svelte?

The best way to maintain consistent UI components across Vue and Svelte is to use a master design system. It generates domain-specific recommendations and component guidance that apply standardized layout and spacing patterns across stacks.

Do I need Tailwind or shadcn/ui to use the generated UI component patterns?

No, you do not need Tailwind or shadcn/ui exclusively, as the tool supports 9 stacks including React, Next.js, and SwiftUI. It provides tailored component guidance and pattern generation for your specific framework.