skills.rest
avel123111
avel123111COMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro-max

Generates design system recommendations and UI/UX guidelines via a BM25-searchable design database.

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

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 database covering 50+ styles, 161 color palettes, 57 font pairings, 161 product types, 99 UX guidelines, and 25 chart types across 10 technology stacks. ## Core Features & Use Cases - Design System Generation: Run the search CLI with --design-system to get a complete recommendation (pattern, style, colors, typography, effects, anti-patterns) for a product type, optionally persisted as a MASTER.md plus per-page override files. - Domain Search: Query specific domains (style, color, typography, ux, chart, landing, product, icons, react, web, google-fonts) using a BM25 ranking engine over CSV datasets. - Stack-Specific Guidelines: Retrieve best practices for React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, and HTML/CSS. - Use Case: When asked to build a fintech dashboard, run the design-system command to receive a recommended palette, font pairing, layout pattern, and a pre-delivery checklist covering accessibility, contrast, and responsive breakpoints. ## Quick Start Ask the AI to generate a design system for your product, for example: "Use the ui-ux-pro-max skill to generate a design system for a travel planning dashboard."

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

Run the search script with the --design-system flag and a query describing your product, for example "python3 scripts/search.py 'fintech dashboard' --design-system". It returns a recommended pattern, style, color palette, typography, effects, and anti-patterns.

What design domains can I search with this tool?▼

You can search style, color, typography, ux, chart, landing, product, icons, react, web, and google-fonts domains using the --domain flag. Each domain queries a dedicated CSV dataset with BM25 ranking.

Does it support framework-specific UI guidelines?▼

Yes, stack-specific guideline files exist for React, Next.js, Vue, Svelte, Astro, SwiftUI, React Native, Flutter, Nuxt, HTML/Tailwind, shadcn, Jetpack Compose, Three.js, Angular, Laravel, and JavaFX. Use the stack search option with your framework name.

Can I save the generated design system for later sessions?▼

Yes, add the --persist flag to write a design-system/MASTER.md file as the global source of truth. Use --page to also create page-specific override files under design-system/pages/ that take precedence over the master rules.

What are the requirements to run the search scripts?▼

Python 3 is required; the scripts use only the standard library (csv, json, re, pathlib), so no pip installs are needed. On Windows, invoke the scripts with python instead of python3.

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 applies only when a task changes how an interface looks, feels, moves, or is interacted with.

Related Skills

Explore More Design & Creative Skills→
TriNgo0108TriNgo0108

ui-ux-pro-max

Generate design systems with color palettes, fonts, and stack-specific guidelines.

Community
Advanced
Corvalis-LLCCorvalis-LLC
6

ui-ux-pro-max

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

Official
Advanced
fusenginefusengine
22

validating-accessibility

Validate digital interfaces against WCAG 2.2 Level AA accessibility standards.

Community
Intermediate
Marcus-BoniMarcus-Boni
1

shadcn

Manage shadcn components and project configurations via CLI.

Community
Advanced