ui-ux-pro-max

Generate UI/UX design system recommendations from BM25 searches over product datasets.

2|Updated Apr 15, 2026
One-click install
npx skills add https://github.com/mdnaimul22/human-skills --skill ui-ux-pro-max-mdnaimul22
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/mdnaimul22/human-skills/tree/main/skills/ui-ux-pro-max
Command: npx skills add https://github.com/mdnaimul22/human-skills --skill ui-ux-pro-max-mdnaimul22

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

UI/UX decisions often stall product delivery because teams lack consistent, accessible design guidance across pages, components, and stacks, causing inconsistent styling and avoidable UX issues.

Core Features & Use Cases

  • Design System Generation: Produces a complete, tailored set of UI guidance including pattern/sections, style priorities, color mood, typography guidance, key effects, and explicit anti-patterns for a target product direction.
  • Domain & Stack-Scoped Recommendations: Uses searchable rules for colors, typography, landing patterns, UX guidelines, chart/data viz guidance, and stack-specific implementation tips across common web and mobile frameworks.
  • Quality Control for Implementation: Helps you review or fix UI code by focusing on accessibility, interaction, layout/responsive behavior, motion guidelines, and component consistency before you ship.

Quick Start

Tell the AI: Generate a design system for "Serenity Spa" using the UI/UX Pro Max skill based on a beauty spa wellness product, then output colors, typography, a landing page pattern, and the top anti-patterns to avoid.

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

To generate a UI/UX design system, provide your product direction and stack to receive production-ready recommendations for patterns, style priorities, color palettes, typography, and UX rules. The system applies category-based reasoning to output tailored guidance for landing pages, dashboards, or SaaS experiences.

What's the best way to ensure frontend components meet accessibility standards?

To ensure frontend components meet accessibility standards, apply a quality control review focusing on interaction, responsive layout, and component consistency before shipping. This approach evaluates your UI code against explicit UX guidelines and motion rules to prevent avoidable accessibility issues.

Can I get typography and color palette recommendations for a specific tech stack?

Yes, you can get stack-specific typography and color palette recommendations by inputting your target stack. The system executes multi-domain searches over product, style, and color datasets to provide implementation tips tailored to common web and mobile frameworks.

How do I structure a responsive landing page pattern for an e-commerce experience?

To structure a responsive landing page pattern for an e-commerce experience, request a design system generation for that product direction. The system outputs tailored section patterns, layout behaviors, and key visual effects while flagging explicit anti-patterns to avoid.

Does this approach provide data visualization and chart guidance for admin dashboards?

Yes, this approach provides data visualization and chart guidance for admin dashboards. It applies searchable rules and category-based reasoning to output chart guidance, interaction rules, and responsive layout decisions specific to data-heavy admin panels.

Why does my design system output include anti-patterns to avoid?

Your design system output includes anti-patterns to avoid because it enforces quality control by flagging explicit styling and UX issues. This prevents inconsistent styling across pages and components, ensuring accessible design guidance before product delivery.