ui-ux-pro-max

Generate UI/UX design systems with stack-specific implementation guidelines.

1.6k|502|Updated Jan 31, 2026
One-click install
npx skills add https://github.com/hzm0321/real-time-fund --skill ui-ux-pro-max-hzm0321
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/hzm0321/real-time-fund/tree/main/.cursor/skills/ui-ux-pro-max
Command: npx skills add https://github.com/hzm0321/real-time-fund --skill ui-ux-pro-max-hzm0321

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 streamlines the UI/UX design process by providing comprehensive, data-driven recommendations and best practices, ensuring professional and effective digital product interfaces.

Core Features & Use Cases

  • Design System Generation: Creates a complete design system based on project type, industry, and style preferences.
  • Component-Specific Guidance: Offers detailed advice on colors, typography, layout, and interaction patterns.
  • Stack-Specific Best Practices: Provides implementation guidelines for various frontend technologies.
  • Use Case: A startup needs to design a new fintech dashboard. They can use this Skill to generate a professional design system, get color palettes, font pairings, and Tailwind CSS implementation tips, significantly accelerating their design and development cycle.

Quick Start

Use the ui-ux-pro-max skill to generate a design system for a 'fintech dashboard' project.

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 UI design system for a specific industry like fintech?

To generate a UI design system, input your project type, industry, and style keywords. The reasoning engine analyzes these parameters to recommend professional patterns, colors, typography, and interaction effects tailored to your specific industry context.

Can I get Tailwind CSS implementation guidelines for my React frontend project?

Yes, you can get Tailwind CSS implementation guidelines for React frontend projects. The system provides stack-specific best practices and component-level advice for multiple frontend stacks including html-tailwind, React, and Next.js environments.

What is the best way to structure UX guidelines for a new web application?

The best way to structure UX guidelines is using a searchable database to match project requirements with established patterns. This data-driven approach ensures professional digital product interfaces by providing comprehensive recommendations for layout and interaction patterns.

Does this design system generator work with Next.js development stacks?

Yes, this design system generator works with Next.js development stacks. It explicitly supports Next.js alongside React and html-tailwind, providing detailed implementation guidelines and stack-specific best practices for each frontend environment.

How do I choose the right color palette and typography for a digital product interface?

To choose the right color palette and typography, provide your project type and style preferences to the reasoning engine. It outputs data-driven recommendations for color palettes and font pairings that align with your specific industry and design requirements.