ui-ux-pro-max

Generate UI/UX design recommendations and CLI-driven design systems for web and mobile apps.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

It eliminates guesswork and inconsistency in UI/UX design across web and mobile applications by providing a comprehensive knowledge base of styles, color palettes, font pairings, and UX guidelines.

Core Features & Use Cases

  • Exhaustive database of 50+ design styles, 161 color palettes, 57 font pairings, 99 UX guidelines, and 25 chart types across 10 technology stacks.
  • CLI‑driven generation of complete design systems, with persistence for master and page‑specific overrides.
  • Priority‑ordered rule categories covering accessibility, interaction, performance, style selection, layout, typography, animation, forms, navigation, and data visualization.
  • Applies to landing pages, dashboards, admin panels, e‑commerce sites, SaaS products, portfolios, blogs, and mobile apps built with React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, or plain HTML/CSS.

Quick Start

Generate a design system for a fintech dashboard built with React.

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 React or Next.js application?

You can generate a complete design system for React or Next.js using CLI-driven commands that output style, color palette, typography, and component guidelines, with persistence for master and page-specific design overrides.

What's the best way to ensure UI accessibility and consistency across web and mobile apps?

Apply priority-ordered rule categories covering accessibility, interaction, performance, and layout guidelines, drawing from a database of 99 UX guidelines and 57 font pairings to ensure consistent UI across web and mobile apps.

Can I use this to create UX guidelines for mobile apps built with Flutter or React Native?

Yes, you can generate UX guidelines for mobile apps built with Flutter, React Native, or SwiftUI, as it provides design recommendations across 10 technology stacks including comprehensive interaction and accessibility rules.

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

Choose the right color palette and font pairing for a SaaS dashboard by querying a database of 161 color palettes and 57 font pairings, applying priority-ordered style selection and typography rules to match your dashboard's context.

Does it support generating component guidelines for Tailwind and shadcn/ui?

Yes, it supports generating component guidelines for Tailwind and shadcn/ui, delivering prioritized rule categories that cover layout, forms, navigation, and data visualization alongside stack-specific styling recommendations.