skills.rest
yuribodo
yuribodoCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

ui-ux-pro-max

Generate design systems with styles, palettes, typography, and UX guidelines.

2|Updated Sep 9, 2025
Search Tags:#typography#accessibility#ui-ux#design-system#color-palettes#design-guidelines#component-library
One-click install
npx skills add https://github.com/yuribodo/givememoney-front --skill ui-ux-pro-max-yuribodo
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/yuribodo/givememoney-front/tree/main/.cursor/skills/ui-ux-pro-max
Command: npx skills add https://github.com/yuribodo/givememoney-front --skill ui-ux-pro-max-yuribodo

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill provides a centralized UI/UX design intelligence toolkit to accelerate design system decisions across styles, palettes, typography, accessibility, and components.

Core Features & Use Cases

  • Pattern library: 50+ styles, 97 color palettes, 57 font pairings, and 99 UX guidelines to inform component design and visual systems.
  • Cross-stack guidance: Works across web and mobile stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui) to support dashboards, landing pages, admin panels, and marketing sites.
  • Automation-ready workflows: Provides actionable design-system generation commands and workflow steps for planning, building, reviewing, and refining UI.

Quick Start

Use the ui-ux-pro-max skill to generate a comprehensive design system and guidelines for your project.

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 design system with color palettes and typography for my web app?▼

Generate a design system by accessing a centralized toolkit with 97 color palettes, 57 font pairings, and 50+ styles to inform component design and visual systems for web and mobile projects.

What UX guidelines should I follow for building accessible dashboards?▼

Accessible dashboards rely on 99 actionable UX guidelines covering accessibility, component design, and visual systems to help designers and frontend engineers make informed UI decisions.

Can I use this UI/UX design intelligence with React, Next.js, and Tailwind?▼

Yes, cross-stack guidance supports React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, and shadcn/ui for building dashboards, landing pages, admin panels, and marketing sites.

What's the best way to choose font pairings and color palettes for a landing page?▼

Choose font pairings and color palettes by querying a pattern library containing 57 font pairings and 97 color palettes, enabling informed visual decisions for landing pages and marketing sites.

Does this design system toolkit include chart types for data visualization components?▼

Yes, the design system toolkit includes 25 chart types alongside component library guidance to support data visualization needs across dashboards and admin panels.

How do I plan and review UI component design workflows for a mobile app?▼

Plan and review UI components using automation-ready workflows that provide actionable design-system generation commands and steps for planning, building, reviewing, and refining mobile app interfaces.

Related Skills

Explore More Design & Creative Skills→
zhizhunbaozhizhunbao

senior-architect

Design system architectures and evaluate options with ADR documentation and diagram generation.

Community
Advanced
opzero1opzero1
3

figma-design

Extract design tokens, component details, and assets from Figma files.

Official
Intermediate
MajesteitBartMajesteitBart
2

shadcn-ui-expert

Build accessible React UI components with shadcn-ui, Tailwind CSS, and Radix UI.

Community
Intermediate
aditisharma0204aditisharma0204

creative-director

Define visual direction and create Figma design systems with moodboards, color palettes, and typography tokens.

Community
Advanced