skills.rest
Rafaelp122
Rafaelp122COMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro-max

Generate UI and UX design systems with color palettes, typography, and accessibility checklists.

2|2|Updated Jul 1, 2025
Search Tags:#typography#accessibility#react#ui-ux#design-system#color-palette#ux-audit
One-click install
npx skills add https://github.com/Rafaelp122/wedding_management --skill ui-ux-pro-max-rafaelp122
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/Rafaelp122/wedding_management/tree/main/.agents/skills/ui-ux-pro-max
Command: npx skills add https://github.com/Rafaelp122/wedding_management --skill ui-ux-pro-max-rafaelp122

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This Skill eliminates guesswork and manual effort when choosing styles, colors, typography, layouts, and accessibility fixes by generating prioritized, production-ready UI/UX recommendations for web and mobile projects.

Core Features & Use Cases

  • Generates complete design systems (pattern, style, colors, typography, effects) tailored to a product type and project goals using searchable domain data and reasoning rules.
  • Provides UX checklists, accessibility rules, interaction and animation guidance, chart and data visualization recommendations, and a pre-delivery checklist for QA.
  • Includes CLI scripts to search datasets, build and persist a MASTER design-system file and page-specific overrides, and run BM25-powered style searches for rapid iteration.
  • Use cases: create a SaaS dashboard design system, pick an accessible color palette for an e-commerce site, review and fix component accessibility and touch targets, or generate a landing-to-dashboard style roadmap.

Quick Start

Run a design system generation for a SaaS dashboard named Serenity Spa and persist the MASTER.md and optional page overrides using the ui-ux-pro-max skill.

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 UI/UX design system for a React dashboard?▼

To generate a UI/UX design system for a React dashboard, define your project goals and component requirements. The system produces structured design outputs including color palettes, typography suggestions, and accessibility checklists tailored to your product type.

What is the best way to choose an accessible color palette for web interfaces?▼

Choosing an accessible color palette for web interfaces involves applying accessibility rules and interaction guidance to ensure contrast and usability. You receive prioritized, production-ready color systems tailored to your specific product type and project goals.

How do I run a UX audit for mobile app touch targets and accessibility?▼

Running a UX audit for mobile app touch targets requires reviewing component accessibility and interaction patterns against established rules. The process outputs a structured accessibility checklist and recommendations to fix identified interface issues.

Can I persist a design system master file and page-specific overrides?▼

Yes, you can persist a design system master file and page-specific overrides using the included CLI scripts. The scripts build and save a MASTER.md file along with optional page overrides to maintain your design system artifacts.

Does this design system generation approach work for both landing pages and mobile apps?▼

Yes, this design system generation approach works for both landing pages and mobile apps. It generates comprehensive UI and UX recommendations, including chart visualizations and animation guidance, tailored to web and mobile interfaces.

When do I need a typography suggestion for a SaaS interface?▼

You need a typography suggestion for a SaaS interface when creating or refactoring components to ensure readability and visual hierarchy. The system generates structured typography recommendations based on searchable domain data and reasoning rules.

Related Skills

Explore More Design & Creative Skills→
AesopScottAesopScott
1

design-experience-plus-plus

Generate website and product surface designs using MAPS M8 Experience Design.

Community
Advanced
danghungtb26danghungtb26
3

ui-ux-pro-max

Generate design systems for web and mobile projects across nine technology stacks.

Community
Advanced
leexb-wp21-progleexb-wp21-prog

ui-ux-pro-max

Generate UI/UX design guidance for web and mobile interfaces.

Community
Advanced
Corvalis-LLCCorvalis-LLC
6

ui-ux-pro-max

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

Official
Advanced