ui-ux-pro-max

Generate design systems with styles, palettes, font pairings, and chart types.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires csv, re, pathlib, math, collections, json, os, datetime, argparse, sys, io, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides comprehensive UI/UX design intelligence, offering guidance on styles, color palettes, typography, and best practices to create visually appealing and user-friendly interfaces.

Core Features & Use Cases

  • Design System Generation: Create detailed design systems based on project requirements.
  • Style & Palette Recommendations: Get suggestions for 67 styles and 96 color palettes.
  • Typography Pairing: Find optimal font pairings from 57 options.
  • UX Best Practices: Access guidelines for accessibility, performance, and interaction design.
  • Use Case: When designing a new SaaS dashboard, use this Skill to generate a complete design system, including a professional color palette, clean typography, and adherence to accessibility standards.

Quick Start

Generate a design system for a new e-commerce website.

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 design system for a web application?

Generate a complete design system by defining project requirements to receive style recommendations, color palettes, typography pairings, and UX best practices. This provides a foundational visual language and component guidelines for your web application interface.

What is the best way to choose a color palette and typography for a SaaS dashboard?

Choosing a color palette and typography for a SaaS dashboard involves matching visual styles to user needs. Access 96 color palettes and 57 font pairings to find combinations that ensure readability, accessibility, and a professional aesthetic.

Can I find accessible font pairings and UX guidelines for mobile app design?

Yes, you can find accessible font pairings and UX guidelines for mobile app design. It provides 57 font pairings and specific UX best practices for accessibility, performance, and interaction design across 13 technology stacks.

How do I review and fix existing UI/UX code for accessibility standards?

Review and fix UI/UX code by applying accessibility best practices to your existing components. It checks your code against established interaction design and accessibility guidelines, then offers actions to refactor, improve, and optimize visual elements.

Does this UI/UX design intelligence work with shadcn/ui components?

Yes, it works with shadcn/ui components by integrating with the shadcn/ui MCP for component search. This allows you to find and implement UI elements that match your generated design system, color palettes, and typography pairings.

What chart types and visual styles are available for data visualization design?

For data visualization design, 25 chart types and 67 distinct visual styles are available. These options help you match data density and user context while maintaining accessibility and performance standards across different technology stacks.