skills.rest
adrianasiam19
adrianasiam19COMMUNITY
Explore all skills by this author →
GitHub

ui-ux-pro-max

Searches a CSV database of UI/UX styles, colors, typography, and guidelines using BM25 ranking.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve? Choosing the right visual style, color palette, font pairing, and UX patterns for a web or mobile project requires extensive design knowledge, and reviewing UI code for accessibility and usability issues is time-consuming without a structured reference. ## Core Features & Use Cases - Design System Generation: Run a single query to get a complete design system recommendation (style, colors, typography, effects) matched to your product type, with optional persistence to MASTER.md and per-page override files. - Domain-Specific Search: Query 8 domains (style, color, typography, chart, landing, product, ux, prompt) plus 10 stack-specific guideline sets covering React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, and Tailwind. - UX Review Checklists: Apply 99 prioritized UX guidelines covering accessibility, touch targets, animation, forms, and navigation to audit existing interfaces. - Use Case: When building a fintech dashboard, run the design-system search to get a recommended palette and font pairing, then search the chart domain for the right visualization type and the ux domain for accessibility rules. ## Quick Start Ask the AI to generate a design system for your product type, for example: "Use the ui-ux-pro-max skill to recommend 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 project?▼

Run the search script with the --design-system flag and a query describing your product type and industry. 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 for color palettes or font pairings?▼

Use the --domain flag with color or typography and a keyword query, for example "--domain color fintech trust". The BM25 engine ranks matching rows from the CSV database and returns hex values or Google Fonts pairings with Tailwind config snippets.

Which frameworks and stacks are supported?▼

Stack-specific guideline searches cover html-tailwind, react, nextjs, vue, nuxtjs, nuxt-ui, svelte, swiftui, react-native, and flutter. Use the --stack flag with a query to retrieve do/don't rules, code examples, and severity ratings for that stack.

Does the skill require any Python packages to be installed?▼

No external packages are required. The search scripts use only the Python standard library (csv, re, math, argparse, pathlib), so any Python 3 installation works without pip installs.

When should I not use this UI/UX search tool?▼

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

Related Skills

Explore More Design & Creative Skills→
nhatmobile1nhatmobile1

design-styles

Analyze web design styles and extract color palettes, typography, and layout guidelines.

Community
Basic
george11642george11642
2

web-frontend

Implement accessible React and Next.js UI components with Tailwind styling.

Community
Intermediate
SonPaierSonPaier

accessibility

Audit web accessibility against WCAG 2.2 guidelines.

Community
Intermediate
shinnytechshinnytech

using-shadcn-ui

Create React UI components with shadcn/ui and Tailwind CSS.

Official
Intermediate