ui-ux-pro-max

Generate structured UI/UX design systems with patterns, colors, typography, and accessibility notes.

Updated Jul 30, 2025

Search Tags:#typography #ui #accessibility #animation #ux #design-system #color-palette

Ready to run

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

💬 Prompt for ChatGPT / Claude Chat▼

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

UI/UX design intelligence consolidates patterns, palettes, and guidelines into a single source of truth, reducing decision fatigue and ensuring accessible, consistent interfaces across web and mobile.

Core Features & Use Cases

Comprehensive, searchable UI design guidelines across color, typography, layout, accessibility, and animation.
Multi-stack compatibility (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui) for end-to-end design guidance.
Automated design-system generation with governance, reasoning rules, and practical implementation notes.

Quick Start

Describe your product context (type, audience, and constraints) and ask for a complete UI/UX design system.

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 specific product context?▼

A design system reduces decision fatigue and ensures accessible, consistent interfaces across web and mobile by consolidating patterns, palettes, and guidelines into a single source of truth for UI/UX governance.

What's the best way to ensure accessibility is included in my color palette and typography choices?▼

Accessibility is emphasized by applying governance and reasoning rules across color, typography, and layout domains, producing a cohesive design system with practical implementation notes for compliance.

Does this UI design guidance work with frameworks like React, Next.js, Vue, Svelte, and Tailwind?▼

Yes, the UI design guidance offers multi-stack compatibility across React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, and shadcn/ui for end-to-end design implementation.

How do I apply animation guidelines within a generated design system?▼

Animation guidelines are applied as part of the comprehensive UI design patterns, returning structured effects and implementation notes within the design-system object to ensure cohesive motion across interfaces.

Can I get layout and typography recommendations for both web and mobile platforms?▼

Yes, providing your product context yields layout and typography recommendations designed for cross-platform consistency, supporting both web and mobile environments through multi-stack compatibility.