ui-ux-pro-max

Generate design systems with styles, palettes, typography, charts, and stacks.

1|Updated Mar 25, 2026
One-click install
npx skills add https://github.com/Elliot-TangS/EliteChain --skill ui-ux-pro-max-elliot-tangs
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/Elliot-TangS/EliteChain/tree/main/.claude/skills/ui-ux-pro-max
Command: npx skills add https://github.com/Elliot-TangS/EliteChain --skill ui-ux-pro-max-elliot-tangs

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

UI/UX design teams often struggle with maintaining consistency across products and projects. This Skill provides a centralized, searchable library of styles, palettes, typography, charts, and multi-stack guidance to accelerate design decisions and ensure cohesive user interfaces.

Core Features & Use Cases

  • Extensive design system catalog: 67 styles, 96 palettes, 57 font pairings, 25 chart types, and 13 technology stacks to speed up UI decisions.
  • Guidance across critical UX domains: accessibility, layout, color, typography, spacing, animation, and interaction patterns with practical checklists and examples.
  • Searchable, reusable design workflows: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, and check UI/UX code across web and mobile platforms.
  • Real-world use cases: websites, dashboards, admin panels, landing pages, SaaS apps, portfolios, blogs, and mobile experiences across React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, and more.
  • Integrations: MCP-powered component search and examples to speed up component discovery.

Quick Start

Create a complete design system for a SaaS dashboard by defining your project goals, palettes, typography, and layout patterns.

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 create a consistent design system for a SaaS dashboard?▼

You can establish a single source of truth for UI consistency by generating styles, palettes, typography, and layout patterns with an actionable implementation checklist and master/override workflow.

Can I use this design system generator with React Native and Flutter?▼

Yes, the design system generator supports cross-platform mobile app development by providing UI/UX guidelines and pattern libraries specifically tailored for React Native, Flutter, and SwiftUI tech stacks.

What is the best way to maintain typography and color palette consistency across web apps?▼

The best way to maintain typography and color palette consistency is to use a searchable library offering 96 palettes and 57 font pairings, ensuring cohesive user interfaces across various web app projects.

Does the UI/UX catalog include accessibility and interaction pattern guidelines?▼

Yes, the UI/UX catalog includes comprehensive guidance across critical UX domains such as accessibility, interaction patterns, spacing, and animation, complete with practical checklists and examples.

How do I implement a master/override workflow for design tokens?▼

You can implement a master/override workflow by defining core design tokens for styles and palettes as a master baseline, then applying localized overrides for specific web or mobile app contexts.

When should I not use a static design system catalog for UI development?▼

You should avoid relying solely on a static catalog when your project requires highly custom, dynamic theming outside of predefined styles, or when integrating tech stacks beyond the 13 supported frameworks.