ui-ux-pro-max

Generate UI/UX design guidelines across React, Next.js, Vue, and Flutter stacks.

10|1|Updated Dec 16, 2024
One-click install
npx skills add https://github.com/wanghaisheng/cloudflare-workers-d1-r2-expo-turborepo-trpc-workflows-astro-cleark --skill ui-ux-pro-max-wanghaisheng
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/wanghaisheng/cloudflare-workers-d1-r2-expo-turborepo-trpc-workflows-astro-cleark/tree/main/ref/ui-ux-pro-max-skill-main/.claude/skills/ui-ux-pro-max
Command: npx skills add https://github.com/wanghaisheng/cloudflare-workers-d1-r2-expo-turborepo-trpc-workflows-astro-cleark --skill ui-ux-pro-max-wanghaisheng

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This guide provides comprehensive UI/UX design intelligence to accelerate building consistent, accessible, and visually compelling applications across multiple tech stacks.

Core Features & Use Cases

  • 50+ styles, 97 color palettes, 57 font pairings across 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui)
  • 99 UX guidelines covering accessibility, interaction, performance, layout, and typography
  • Design-system generation and evaluation for websites, dashboards, landing pages, admin panels, e-commerce, SaaS, portfolios, blogs, and mobile apps

Quick Start

Ask the AI to generate a complete UI/UX design system for a SaaS dashboard with dark mode and accessibility compliance

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/UX design system for a SaaS dashboard with dark mode and accessibility compliance?

Generate a UI/UX design system by requesting guidelines for a SaaS dashboard. The system outputs a persistent master configuration with page overrides, covering dark mode palettes, accessible typography, and interaction rules.

Can I use this to generate design guidelines for a React Native and Flutter mobile app?

Yes, you can generate design guidelines for React Native and Flutter mobile apps. The system applies 99 UX guidelines covering accessibility, layout, and interaction across these mobile stacks.

What is a persistent master design configuration with page overrides?

A persistent master design configuration is a centralized baseline of UI/UX rules. Page overrides allow specific application views to deviate from this master baseline while maintaining global consistency.

How do I apply a color palette and font pairing to a Next.js or Svelte application?

Apply color palettes and font pairings by selecting from 97 palettes and 57 font pairings. The system outputs markdown documentation integrated with Next.js or Svelte workflows.

Does the design system workflow support Tailwind and shadcn/ui component libraries?

Yes, the design system workflow supports Tailwind and shadcn/ui component libraries. It generates compatible design intelligence for scalable interfaces using these frameworks.

What's the best way to document UX guidelines for accessibility and performance across multiple stacks?

Document UX guidelines by generating markdown files covering 99 rules for accessibility and performance. This ensures consistent documentation across React, Vue, SwiftUI, and other supported frameworks.