skills.rest
fts-pro
fts-proCOMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro-max

Generates UI/UX design recommendations and searchable guidelines for web and mobile interfaces.

Updated May 18, 2026
Search Tags:#typography#accessibility#design system#color palette#ui design#ux guidelines#bm25 search
One-click install
npx skills add https://github.com/fts-pro/FTS-MMIS-AFRIKA --skill ui-ux-pro-max-fts-pro
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/fts-pro/FTS-MMIS-AFRIKA/tree/main/.agent/skills/ui-ux-pro-max
Command: npx skills add https://github.com/fts-pro/FTS-MMIS-AFRIKA --skill ui-ux-pro-max-fts-pro

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve? Making consistent, professional UI/UX decisions is hard when building pages, components, or entire apps without a design system. This Skill provides a searchable database of styles, color palettes, font pairings, UX guidelines, and stack-specific best practices so every design decision is grounded in established rules. ## Core Features & Use Cases - Design System Generation: Run a single command to get a complete design system (pattern, style, colors, typography, effects) matched to your product type, with optional persistence to MASTER.md and per-page override files. - Domain Search: Query 8 domains (style, color, typography, chart, landing, product, ux, prompt) plus 10 tech stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, HTML/CSS) via a BM25-powered CLI. - UX Review Checklists: Apply 99 prioritized UX guidelines covering accessibility, touch targets, animation, forms, navigation, and charts when reviewing or fixing existing UI code. - Use Case: When asked to build a fintech dashboard, run the design-system search to get a recommended style, palette, and font pairing, then query the chart domain for the right visualization types. ## Quick Start Ask the AI to generate a design system for your product type, for example: "Use the ui-ux-pro-max skill to create a design system for a beauty spa landing page."

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 for a new web or mobile app?▼

Run python3 scripts/search.py with your product type and keywords plus the --design-system flag. It searches product, style, color, landing, and typography domains in parallel and returns a complete recommendation with reasoning and anti-patterns to avoid.

How do I search UI/UX guidelines for React or SwiftUI?▼

Use the --stack flag with the search CLI, for example --stack react or --stack swiftui. Supported stacks include html-tailwind, react, nextjs, vue, nuxtjs, svelte, swiftui, react-native, and flutter, each returning do/don't rules with code examples.

What design resources does this UI/UX database include?▼

The database contains 50+ styles, 161 color palettes, 57 font pairings, 161 product types, 99 UX guidelines, and 25 chart types stored as CSV files. A BM25 ranking algorithm matches your query keywords to the most relevant entries.

Does the design system search require Python installed?▼

Yes, the search CLI requires Python 3. The SKILL.md includes install instructions for macOS (brew), Ubuntu/Debian (apt), and Windows (winget), and the scripts use only the Python standard library with no external packages.

When should I not use this UI/UX design skill?▼

Skip it for pure backend logic, API or database design, non-visual performance optimization, infrastructure work, and non-visual automation scripts. It only applies when a task changes how a feature looks, feels, moves, or is interacted with.

Related Skills

Explore More Design & Creative Skills→
clovernguyen1010-ship-itclovernguyen1010-ship-it

ba-brand-info-extract

Collect brand assets including name, tagline, personality, audience, and platforms.

Community
Intermediate
avibebuilderavibebuilder
113

frontend-design

Build distinctive frontend interfaces with framework-specific code and accessibility guidance.

Official
Advanced
etewiahetewiah
635

theme-evaluation

Evaluate theme palettes for WCAG contrast and accessibility compliance.

Community
Advanced
prateekprateek

hig-project-context

Create and maintain a shared Apple design context document at .claude/apple-design-context.md.

Community
Intermediate