ui-ux-pro-max

Generate UI/UX design systems with color, typography, and component guidelines.

13|Updated Feb 4, 2026
One-click install
npx skills add https://github.com/abeldotam/bmad-viewer --skill ui-ux-pro-max-abeldotam
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/abeldotam/bmad-viewer/tree/main/.agents/skills/ui-ux-pro-max
Command: npx skills add https://github.com/abeldotam/bmad-viewer --skill ui-ux-pro-max-abeldotam

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

UI/UX Pro Max provides centralized UI/UX guidelines and automated design-system generation to speed up design decisions and ensure consistency across web and mobile projects.

Core Features & Use Cases

  • Comprehensive design guidance across 50+ styles, 97 color palettes, 57 font pairings, 99 UX guidelines, and 25 chart types across 9 stacks.
  • Searchable, prioritized recommendations for components, color, typography, and layouts to accelerate project scoping.
  • Generate design-system artifacts (MASTER, page overrides) to enable hierarchical styling and reusable tokens.

Quick Start

Provide your project name and design goals, then run the design system generator to produce a ready-to-use 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 UI/UX design system for multiple frameworks?

Generate a UI/UX design system by providing your project name and goals to produce ready-to-use design tokens, color palettes, typography rules, and component guidelines. The system applies these rules across websites, dashboards, and mobile apps using multiple stacks like React, Next.js, and Vue.

What is a Master and Overrides persistence pattern in design systems?

Master and Overrides persistence is a hierarchical styling pattern that establishes a global MASTER design system while enabling page-level overrides. It allows developers to maintain centralized UI/UX guidelines while applying specific styling exceptions for individual web or mobile app pages.

Does this UI/UX design generator support Svelte and Tailwind CSS?

Yes, the UI/UX design generator supports Svelte and Tailwind CSS among nine total stacks. It applies prioritized color, typography, and component recommendations across these frameworks to ensure consistent design system implementation for web interfaces.

How do I choose the right color palette and font pairing for a web dashboard?

Choose the right color palette and font pairing by using searchable, prioritized recommendations across 97 color palettes and 57 font pairings. The system provides reasoning-based prioritization to match your specific dashboard or mobile app requirements.

Can I apply a single design system across both websites and mobile apps?

Yes, you can apply a single design system across both websites and mobile apps. The system generates centralized UI/UX guidelines and reusable tokens that ensure visual consistency and automated styling application across different platforms and output formats.

What's the best way to manage page-level styling overrides without breaking global design tokens?

The best way to manage page-level overrides is using the Master and Overrides persistence pattern. This hierarchical styling method maintains your global design tokens in the MASTER file while isolating page-level exceptions, ensuring project-wide UI consistency without breaking core rules.