ui-ux-pro-max

Generate UI and UX design guidance for interfaces, components, and page layouts.

Updated May 28, 2026

Search Tags:#typography #accessibility #design system #dashboard #ui design #tailwind #ux review

Ready to run

npx skills add https://github.com/haryelramalho/skills --skill ui-ux-pro-max-haryelramalho

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/haryelramalho/skills/tree/main/skills/community/ui-ux-pro-max
Command: npx skills add https://github.com/haryelramalho/skills --skill ui-ux-pro-max-haryelramalho

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This Skill removes the guesswork from UI and UX design by turning a broad product idea into concrete, accessible, implementation-ready interface guidance.

Core Features & Use Cases

Produces design systems with pattern, style, color, typography, effects, and anti-pattern recommendations.
Covers multiple domains including product types, visual styles, accessibility, charts, landing-page structures, and stack-specific implementation advice.
Useful for building or reviewing websites, landing pages, dashboards, admin panels, e-commerce experiences, portfolios, blogs, and mobile apps.
Works with deterministic Python search scripts to find the best matches and persist master plus page-specific design rules.

Quick Start

Ask the skill to create a UI/UX design system for your product and specify the product type, industry, style goals, and target stack.

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 create a design system for a web dashboard using Tailwind and shadcn/ui?▼

To create a dashboard design system, define your product type and stack to receive pattern, color, typography, and component recommendations. The system generates deterministic style rules and persisted master files tailored specifically for Tailwind and shadcn/ui implementations.

How do I generate accessible UI components for a React or Next.js application?▼

Generate accessible UI components by specifying your React or Next.js stack during setup. You receive accessibility recommendations, visual styles, and layout structures that ensure compliance while matching your product's specific interface requirements.

Can I use this to get UX and design guidance for mobile apps built with SwiftUI or React Native?▼

Yes, you can get UX design guidance for mobile apps by specifying SwiftUI or React Native. The system provides tailored layout structures, color palettes, typography rules, and component patterns optimized for mobile interfaces across these frameworks.

What is the best way to structure an e-commerce landing page layout in Svelte?▼

The best way to structure a Svelte e-commerce landing page is to request a design system for that domain. You receive stack-specific implementation advice, visual style recommendations, and layout structures optimized for conversion flows.

Does this design system generator support Vue and Flutter workflows?▼

Yes, the design system generator supports Vue and Flutter workflows. By specifying your target stack, you receive deterministic style, color, and typography recommendations adapted to the specific component patterns and conventions of each framework.

Why do I need persisted design system files when building admin panels?▼

Persisted design system files maintain consistent master and page-specific rules across admin panel pages. They store your established color, typography, and layout patterns, ensuring deterministic search results and preventing visual drift during implementation.