ui-ux-pro-max

Generate UI/UX design systems with styles, palettes, typography, and multi-stack guidance.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

Design teams often struggle to maintain consistency across multiple product surfaces and stacks, leading to slower delivery and fragmented UX decisions.

Core Features & Use Cases

  • 50+ styles, 97 color palettes, 57 font pairings, 99 UX guidelines, and 25 chart types across 9 technology stacks.
  • Searchable, reusable design system database that can generate pattern, style, color, typography, and effects recommendations.
  • Use cases include website dashboards, landing pages, admin panels, SaaS products, and mobile apps with cross-stack consistency.

Quick Start

Invoke the design-system search to generate a complete UI/UX design system tailored to your product.

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 UI design system for a React and Next.js web project?

Generate a cohesive UI design system by running a design-system search to output styles, color palettes, typography pairings, and component patterns tailored for React and Next.js. It creates a searchable repository with master design rules and page-specific overrides for web projects.

What is the best way to maintain UX consistency across cross-stack mobile apps?

Maintain UX consistency by using a centralized design system database that outputs unified color palettes, typography, and component patterns. It delivers cross-stack consistency for SaaS products and mobile apps built with SwiftUI, React Native, and Flutter.

Can I use Tailwind and shadcn/ui with this automated UI design recommendation tool?

Yes, Tailwind and shadcn/ui are supported technology stacks for design system generation. It outputs multi-stack guidance including cohesive styles, color palettes, and component patterns specifically tailored for Tailwind and shadcn/ui environments.

How do I select accessible color palettes and typography pairings for a SaaS dashboard?

Select accessible color palettes and typography pairings by searching the repository of 97 color palettes and 57 font pairings. It applies 99 UX guidelines to output accessible recommendations specifically suited for SaaS dashboards and admin panels.

Does automated design system generation work with Svelte and Vue frontend frameworks?

Yes, automated design system generation works with Svelte and Vue. It outputs cohesive styles, typography, and component patterns across 9 technology stacks, ensuring multi-stack guidance and consistency for web projects built with Svelte and Vue.

Why does my cross-platform UI design fragment across multiple product surfaces?

Cross-platform UI design fragments across multiple product surfaces without a centralized design system. Automating UI/UX design system generation solves this by outputting a searchable repository of cohesive styles, typography, and component patterns across multiple stacks.