ui-ux-pro-max

Generate UI/UX design systems with color palettes, typography, and accessibility rules.

3|Updated Mar 26, 2026
One-click install
npx skills add https://github.com/The13thNode/VibeCorp_PromptCEO --skill ui-ux-pro-max-the13thnode
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/The13thNode/VibeCorp_PromptCEO/tree/main/skills/public/ui-ux-pro-max
Command: npx skills add https://github.com/The13thNode/VibeCorp_PromptCEO --skill ui-ux-pro-max-the13thnode

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Turn fragmented UI/UX decisions into a single, prioritized design system so teams can ship consistent, accessible, and performant interfaces across web and mobile projects.

Core Features & Use Cases

  • Design System Generation: Produces pattern recommendations, style selection, color palettes, typography pairings, and component guidelines tailored to product type and industry.
  • Accessibility & QA: Prioritizes accessibility, touch targets, focus states, contrast ratios, and performance checks with a pre-delivery checklist for production readiness.
  • Stack-aware Implementation: Provides stack-specific guidance and implementation best practices (default html-tailwind) for landing pages, dashboards, e-commerce, SaaS, and mobile apps.
  • Persistence & Overrides: Supports hierarchical design system persistence for master rules and page-level overrides to maintain consistency across sessions.

Quick Start

Create a responsive SaaS dashboard design system with an accessible color palette, font pairings, and Tailwind implementation guidance.

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 SaaS dashboard?

A design system for a SaaS dashboard provides pattern recommendations, accessible color palettes, typography pairings, and component guidelines tailored to your industry. It also delivers stack-specific implementation guidance for React, Next.js, or html-tailwind.

How do I ensure my UI components meet accessibility contrast ratios?

Ensuring UI components meet accessibility contrast ratios involves applying prioritized accessibility rules, focus states, and touch target checks. The system provides a pre-delivery checklist to verify contrast ratios and production readiness.

Does this UI/UX design guidance work with React and SwiftUI?

This UI/UX design guidance works with React, Next.js, Vue, Svelte, and SwiftUI. It delivers stack-aware implementation best practices and component patterns across web and mobile stacks, defaulting to html-tailwind.

What is the best way to maintain consistent typography across multiple web pages?

Maintaining consistent typography across multiple web pages requires hierarchical design system persistence for master rules and page-level overrides. This approach ensures consistent font pairings, color palettes, and style selections across sessions.

How do I get Tailwind implementation guidance for a responsive landing page?

Getting Tailwind implementation guidance for a responsive landing page involves generating stack-specific best practices and component patterns. The system outputs CLI-persisted design-system files containing color palettes and typography pairings when available.