skills.rest
SethyRung
SethyRungCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

ui-ux-pro-max

Generates design system recommendations and searchable UI/UX guidelines from CSV databases via BM25 search.

Updated Aug 5, 2024
Search Tags:#typography#accessibility#design system#color palette#ui design#ux guidelines#bm25 search
One-click install
npx skills add https://github.com/SethyRung/movie-next --skill ui-ux-pro-max-sethyrung
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/SethyRung/movie-next/tree/main/.agents/skills/ui-ux-pro-max
Command: npx skills add https://github.com/SethyRung/movie-next --skill ui-ux-pro-max-sethyrung

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve? Choosing styles, color palettes, typography, and UX patterns for a new interface is slow and inconsistent without a reference system. This Skill provides a searchable design knowledge base and a design system generator so UI decisions are grounded in documented rules rather than guesswork. ## Core Features & Use Cases - Design System Generation: Runs multi-domain searches (product, style, color, landing, typography) and applies reasoning rules to output a complete design system with pattern, palette, fonts, effects, and anti-patterns, optionally persisted as a MASTER.md plus per-page override files. - Domain Search CLI: BM25-based search across CSV databases covering 50+ styles, 161 color palettes, 57 font pairings, 161 product types, 99 UX guidelines, 25 chart types, icons, and Google Fonts. - Stack-Specific Guidelines: Searches best-practice rules for 16 stacks including React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, and shadcn/ui. - Use Case: When asked to build a fintech dashboard, run the design-system command to get a recommended pattern, style, full color token table, font pairing, and a pre-delivery checklist before writing any component code. ## 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 booking app called Serenity Spa.

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 project?▼

Run the search script with the --design-system flag and a product query, for example python3 scripts/search.py "beauty spa wellness" --design-system -p "Serenity Spa". It searches product, style, color, landing, and typography domains, applies reasoning rules, and returns a complete recommendation.

What design data does this UI/UX search tool include?▼

The CSV databases cover over 50 styles, 161 color palettes, 57 font pairings, 161 product types, 99 UX guidelines, 25 chart types, icons, and Google Fonts. It also includes stack-specific guideline files for 16 frameworks such as React, Next.js, SwiftUI, and Flutter.

How do I save a design system for use across sessions?▼

Add the --persist flag to the design-system command to write a design-system/MASTER.md file as the global source of truth. Add --page with a page name to also create a page-specific override file under design-system/pages/ that takes precedence over the master rules.

Does the search tool require external Python packages?▼

No, the scripts use only the Python standard library including csv, json, re, and pathlib. You only need Python 3 installed; there are no pip dependencies to install.

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

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

Related Skills

Explore More Design & Creative Skills→
MaizeCobraMaizeCobra

ui-ux-pro-max

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

Community
Advanced
qazuorqazuor

frontend-design

Guide UI teams through pre-coding design foundations for typography, color, and layout.

Community
Basic
fusenginefusengine
22

validating-accessibility

Validate digital interfaces against WCAG 2.2 Level AA accessibility standards.

Community
Intermediate
xzedmxzedm

figma-generate-design

Builds Figma screens and views from code using design system components, variables, and styles.

Community
Advanced