skills.rest
EliasOulkadi
EliasOulkadiCOMMUNITY
Explore all skills by this author →
𝕏@EliasOulkadiGitHub

ui-ux-pro-max

Generate UI/UX design systems with patterns, palettes, typography, and charts.

110|14|Updated May 12, 2026
Search Tags:#typography#accessibility#ui-ux#design-system#color-palette#ux-guidelines#dashboard-ui
One-click install
npx skills add https://github.com/EliasOulkadi/shokunin --skill ui-ux-pro-max-eliasoulkadi
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/EliasOulkadi/shokunin/tree/main/.pack/skills/ui-ux-pro-max
Command: npx skills add https://github.com/EliasOulkadi/shokunin --skill ui-ux-pro-max-eliasoulkadi

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This Skill solves the problem of inconsistent, hard-to-scale UI/UX by generating a cohesive design system with accessible patterns, colors, typography, charts, and component guidance tailored to a product request.

Core Features & Use Cases

It produces a complete UI/UX design system (styles, color palettes, font pairings, chart types, and UX rules) and supports multi-page persistence using a Master + Overrides pattern. It is useful for designing landing pages, dashboards, admin panels, e-commerce experiences, and mobile app UI across common stacks like React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, and shadcn/ui, with a strong focus on accessibility, interaction quality, performance, and responsive layout.

Quick Start

Run python3 skills/ui-ux-pro-max/scripts/search.py "saas dashboard fintech dark mode" --design-system -p "FinDash" to generate prioritized UI/UX recommendations and a ready-to-use 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 web dashboard?▼

You generate a complete UI/UX design system by running a product and style query, which outputs prioritized recommendations for color palettes, typography pairings, chart choices, and accessibility rules for web and mobile interfaces.

What is a Master plus page-override structure in UI/UX design?▼

A Master plus page-override structure is a design-system persistence pattern that stores a foundational UI/UX system while allowing specific page overrides for custom component styling and layout rules across multi-page applications.

Can I use this approach to design mobile interfaces with React Native and Flutter?▼

Yes, the design system generation supports mobile interfaces across React Native and Flutter, providing tailored UI patterns, typography pairings, and accessibility interaction rules for mobile application layouts.

Does the generated design system include accessibility and interaction guidelines?▼

Yes, the generated design system includes accessibility and interaction guidelines, applying accessible patterns, UX rules, and performance-focused recommendations across selected UI components and page layouts.

What is the best way to create a cohesive color palette and typography pairing for a SaaS application?▼

The best way to create cohesive color palettes and typography pairings is to query a design system generator with your product details, which produces prioritized, reasoned recommendations for your SaaS application.

Do I need Tailwind or shadcn/ui to implement these UI/UX recommendations?▼

No, you do not need Tailwind or shadcn/ui exclusively, as the design system applies UI patterns and UX guidelines across multiple technology stacks including React, Next.js, Vue, Svelte, SwiftUI, React Native, and Flutter.

Related Skills

Explore More Design & Creative Skills→
guilhermemarketingguilhermemarketing
59

ui-ux-pro-max

Generate design systems from UI/UX needs with multi-domain searches.

Community
Advanced
Kouakou-Christ-AxelKouakou-Christ-Axel

ui-ux-pro-max

Provide UI/UX design guidance across React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, and HTML/CSS.

Community
Advanced
PeterHddPeterHdd
27

cleanui

Improve AI-generated user interfaces with design best practices and layout intelligence.

Community
Advanced
hookvibehookvibe
3

ui-ux-pro-max

Generate UI/UX design systems with color palettes and typography guidelines.

Official
Basic