ui-ux-pro-max

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

Updated Jul 30, 2025
One-click install
npx skills add https://github.com/tmarsbr/portifolio --skill ui-ux-pro-max-tmarsbr
Or copy as Structured Prompt for Agent
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.