ui-ux-pro-max

Generate UI/UX design systems with colors, typography, and stack guidelines via BM25 search.

Updated Nov 29, 2025
One-click install
npx skills add https://github.com/achyutkneupane/Blog-Kit --skill ui-ux-pro-max-achyutkneupane
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-ux-pro-max
Source: https://github.com/achyutkneupane/Blog-Kit/tree/main/.ai/skills/ui-ux-pro-max
Command: npx skills add https://github.com/achyutkneupane/Blog-Kit --skill ui-ux-pro-max-achyutkneupane

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve? Choosing consistent colors, typography, layout patterns, and framework-specific practices for a new UI project requires scattered research across many sources, and inconsistent choices lead to unprofessional results. ## Core Features & Use Cases - Design System Generation: Run the search script with the --design-system flag to aggregate product, style, color, landing, and typography data into one recommendation with anti-patterns to avoid. - Domain and Stack Searches: Query 10 domains (style, color, chart, landing, product, ux, typography, icons, react, web) and 13 stacks (html-tailwind, react, nextjs, vue, svelte, swiftui, flutter, shadcn, and more) using a BM25 ranking engine over CSV datasets. - Persistence with Master + Overrides: Save results to design-system/MASTER.md plus per-page override files so rules stay consistent across sessions. - Use Case: When asked to build a landing page for a beauty spa, generate a full design system with pattern, palette, fonts, and effects, then fetch html-tailwind implementation guidelines before writing code. ## Quick Start Ask the AI to generate a design system for your product type and industry, for example: create a design system for a fintech dashboard using the ui-ux-pro-max search script.

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.py script with your product keywords and the --design-system flag, optionally adding -p for a project name. It searches product, style, color, landing, and typography domains in parallel and returns a complete recommendation with anti-patterns.

What tech stacks does this UI design search support?▼

It supports html-tailwind as the default, plus react, nextjs, vue, svelte, swiftui, react-native, flutter, shadcn, and jetpack-compose. Use the --stack flag with a keyword to get framework-specific implementation guidelines.

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

Add the --persist flag to create design-system/MASTER.md as the global source of truth, and use --page to create page-specific override files under design-system/pages/. Page files override the Master file when both exist.

Does the design system generator require external Python packages?▼

No external packages are required. The scripts use only Python standard library modules like csv, re, json, and argparse, so any Python 3 installation works without pip installs.

Why does my search return no results for a keyword?▼

The BM25 engine only returns results with a score above zero, so very short or unrelated keywords may match nothing. Try more specific terms like 'healthcare SaaS dashboard' instead of single generic words, or search a different domain.