skills.rest
billiampalad
billiampaladCOMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro-max

Searches local UI/UX datasets to generate design systems, palettes, typography, and stack-specific guidelines.

1|Updated Mar 9, 2026
Search Tags:#typography#accessibility#design system#color palette#ui ux#bm25 search#gsap animation
One-click install
npx skills add https://github.com/billiampalad/wd4 --skill ui-ux-pro-max-billiampalad
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/billiampalad/wd4/tree/main/.agents/skills/design/ui-ux-pro-max-skill-main/.claude/skills/ui-ux-pro-max
Command: npx skills add https://github.com/billiampalad/wd4 --skill ui-ux-pro-max-billiampalad

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve? Choosing coherent styles, colors, fonts, and interaction patterns for a new interface is slow and inconsistent without a reference base. This Skill provides a searchable local database of UI/UX guidance so design decisions are grounded in curated data rather than guesswork. ## Core Features & Use Cases - Design System Generation: Aggregates product, style, color, landing, and typography matches into a complete design system, with optional persistence as a MASTER.md plus per-page override files. - Domain-Specific Search: Queries 79 styles, 192 product palettes, 74 font pairings, 119 UX guidelines, 105 icons, 17 GSAP presets, 25 chart types, and 22 technology stacks via a BM25 search script. - Design Dials: Tunes output with 1-10 variance, motion, and density sliders that bias style selection, attach GSAP snippets, and override spacing scales. - Use Case: When building a new SaaS dashboard in Next.js, generate a full design system with colors and typography, then query accessibility rules and Next.js-specific performance guidelines before implementing components. ## Quick Start Ask the AI to generate a design system for your product type and stack, for example: create a design system for a minimal AI search homepage built with Next.js.

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 query describing your product type and style keywords. It aggregates product, style, color, landing, and typography matches into a complete recommendation with pattern, palette, fonts, and anti-patterns.

What design data can I search with this tool?▼

You can search 79 styles, 192 product palettes, 74 font pairings, 119 UX guidelines, 105 icons, 17 GSAP motion presets, 25 chart types, and 22 technology stacks. Use --domain for a specific category or --stack for framework-specific guidelines.

Which frameworks and stacks are supported?▼

Supported stacks include React, Next.js, Vue, Svelte, Astro, Angular, Nuxt, Laravel, SwiftUI, React Native, Flutter, Jetpack Compose, HTML-Tailwind, shadcn, Three.js, and several desktop UI frameworks. Pass the detected stack with --stack for implementation-specific guidance.

Does the search tool require external Python packages?▼

No, the search script requires only Python 3 with no external dependencies. It implements BM25 ranking using the standard library and reads local CSV data files.

What happens when a search returns no results?▼

The tool abstains from low-confidence matches using calibrated score and coverage thresholds. You should retry once with a narrower query or explicit domain, and if still empty, fall back to the built-in priority table while stating no database match was found.

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

Add --persist with --output-dir pointed at your project root to create a design-system folder containing a MASTER.md source of truth and optional per-page override files. Existing MASTER.md files are skipped unless --force is explicitly authorized.

Related Skills

Explore More Design & Creative Skills→
ViperJuiceViperJuice
8

library-detection

Detect languages, frameworks, and build tools from package manifests.

Community
Intermediate
musher-devmusher-dev

writing-visual-identity

Define color tokens, typography systems, and spatial rules for marketing pages.

Official
Advanced
letxbrace-droidletxbrace-droid

ios-hig-design

Apply Apple Human Interface Guidelines to iPhone interface design.

Community
Intermediate
Andy-HNUAndy-HNU

design-systems

Plan and structure design systems with component libraries, tokens, and governance.

Community
Intermediate