Source: nextlevelbuilder/ui-ux-pro-max-skill · Maintainer: community: Next Level Builder · License: MIT · Checked: 23 October 2026
What is the UI UX Pro Max skill?
UI UX Pro Max is a community Agent Skill that gives your coding agent a local, searchable database of design knowledge: visual styles, color palettes, font pairings, chart types, UX rules and guidelines for specific stacks. It is for developers who build interfaces with an agent and want it to choose a coherent design direction from data instead of falling back on the same defaults every time.
The skill's description reads: "UI/UX design intelligence for web, mobile, and desktop. This skill should be used when designing, building, reviewing, or fixing interfaces, including pages, components, design systems, accessibility, interaction, responsive layout, typography, color, charts, and stack-specific UI implementation. Searchable local data: 79 searchable styles (50 active), 192 product palettes and reasoning profiles, 74 font pairings, 119 UX guidelines, 105 icons, 17 GSAP presets, 25 chart types, and 22 stacks."
It is one of the most installed design skills. As of 23 October 2026, its skills.sh page listed about 411,000 installs, and the GitHub repository had more than 130,000 stars.
What does it do?
The skill is a Python search tool plus a set of CSV files, wrapped in instructions that tell the agent when and how to query them. The SKILL.md says to use it when a task changes how something "looks, feels, moves, or is interacted with," and to skip it for backend logic, API or database design, infrastructure and non-visual scripts.
It has three ways to search, which the SKILL.md calls its query contract:
- Design system (
--design-system): for a new project or page. It combines product, style, color, landing page and typography matches, applies reasoning rules fromui-reasoning.csv, and returns a pattern, style, colors, typography, effects and anti-patterns to avoid. - Domain search (
--domain): one focused concern, such asux,color,typography,chart,icons,gsaporreact. - Stack guidelines (
--stack): implementation advice for one of 22 stacks, fromreact,nextjsandshadcntoswiftui,flutterandwpf.
Two extras build on the design system mode. --persist saves the result as design-system/<project-slug>/MASTER.md, with page-level overrides in a pages/ folder, so later sessions can reuse the same decisions. Three optional dials, --variance, --motion and --density, each take a value from 1 to 10 and tune the output, for example toward a dense dashboard spacing scale.
The SKILL.md also ranks ten rule categories by priority. Accessibility and touch interaction come first (contrast of 4.5:1, touch targets of at least 44 by 44 pixels), and charts come last. It tells the agent to retry an empty search once with a narrower query, and if nothing matches, to say the advice came from built-in defaults rather than present it as a database result.
What's in the folder:
SKILL.md: the workflow, the priority table and the search commands.scripts/:search.py,core.py,design_system.pyand helpers, plus a test suite.data/: CSV files for styles, colors, typography, Google Fonts, icons, charts, landing patterns, UX guidelines, motion and reasoning rules, and one CSV per stack indata/stacks/.references/:quick-reference.mdwith the full rule text, andpro-rules.md, a pre-delivery checklist for native and mobile app UI.
The README says Python 3.x is required and that the scripts use the standard library only, so they "install nothing and make no network calls."
How do you install the UI UX Pro Max skill?
The README documents two methods: the Claude Code plugin marketplace and its own uipro CLI, which it marks as recommended.
Claude Code plugin. In a Claude Code session, add the marketplace and install the plugin, as described in Claude Code's plugin docs:
/plugin marketplace add nextlevelbuilder/ui-ux-pro-max-skill
/plugin install ui-ux-pro-max@ui-ux-pro-max-skill
The plugin manifest points at the repo's whole .claude/skills/ folder. Today that folder holds seven skills (banner-design, brand, design, design-system, slides, ui-styling and ui-ux-pro-max), so the plugin brings all of them, not just this one.
The uipro CLI. Install the npm package, then run init from your project:
npm install -g ui-ux-pro-max-cli
cd /path/to/your/project
uipro init --ai claude
Swap claude for cursor, codex, windsurf, gemini, copilot or one of the other agents the README lists, or use all. Add --global to install into ~/.claude/skills/ instead of the project's .claude/skills/. If you'd rather not install globally, npx ui-ux-pro-max-cli init --ai claude does the same job. The README warns that the older uipro-cli package is stale. Later, uipro update refreshes the files and uipro uninstall removes them.
The skills CLI. The skills.sh page lists this command for the skills CLI:
npx skills add https://github.com/nextlevelbuilder/ui-ux-pro-max-skill --skill ui-ux-pro-max
Add -g to install for every project, or -a claude-code to skip the agent prompt. One thing to know: the SKILL.md in the repo writes its commands as python "${CLAUDE_PLUGIN_ROOT}/.claude/skills/ui-ux-pro-max/scripts/search.py". Claude Code's skills docs say ${CLAUDE_PLUGIN_ROOT} is filled in only for plugin skills. The SKILL.md does tell the agent that the script lives inside the skill's own folder, but the plugin and the uipro CLI (which writes a SKILL.md with paths for the agent you pick) avoid the question.
Codex and Cursor read the same SKILL.md format; see Codex skills and Cursor skills.
claude.ai. Custom skills upload as a ZIP under Customize, then Skills (Claude Help Center). The README's troubleshooting section says not to upload the full repository ZIP: it holds more than the 200 files claude.ai accepts, and the project does not publish a separate upload ZIP.
How do you use it?
In Claude Code, Cursor, Codex and most other agents the README lists, the skill loads on its own when you ask for UI work. Kiro, Roo Code and KiloCode use a slash command instead: /ui-ux-pro-max followed by your request.
Example prompts (suggestions, not quotes from the repo):
- "Build a landing page for a meal planning app. Generate a design system first and save it to the project."
- "Review the checkout form for accessibility: labels, error placement and focus order."
- "Our analytics dashboard feels cramped. Suggest a denser but readable layout and the right chart types."
- "Retheme this React app to a minimal Swiss style, reusing the existing tokens."
- "Which font pairing suits a children's education product?"
For restyling an existing app, the README offers a longer prompt and a four-step checklist: audit hard-coded values, map them to semantic roles, migrate one component batch at a time, and verify contrast, focus states and themes after each batch. It adds that search results "provide design guidance; they do not automatically rewrite your app."
The only requirement is Python 3. The README says agents using the skill should never install software on your machine, and are told to ask you instead.
Tips and limits
- Long fields get cut. Human-readable output truncates long fields at 300 characters. The README's fix is to add
--jsonfor the full data. - Saved design systems are protected.
--persistwon't overwrite an existingMASTER.mdunless you pass--force, and the SKILL.md tells the agent never to use--forcewithout your explicit approval. - Results are advice. The SKILL.md says to treat search results as recommendations that never override you or your repository's rules, and not to include private project data in queries.
- Big catalog, generic risk. A database of styles and palettes gives the agent options, but the choice is still a match on keywords. Pair it with a taste-focused skill such as frontend-design if results feel templated.
- Basic and premium. The README describes a premium version, offered through uupm.cc, with extended brand, logo, banner, slide and icon skills. The repository itself is the open-source version under the MIT License.
- Security. As of 23 October 2026, the skills.sh page showed Pass for all three audits it lists (Gen Agent Trust Hub, Socket and Snyk). The scripts run locally with your Python, so read them before installing, as you would for any skill that runs code.
Save it in your Kipt library
In Kipt, open Skills and paste the skill's GitHub folder link into the import box. Kipt reads the SKILL.md and its files; for a repo with many skills, like this one, it shows a list to pick from. You can also drop the folder or a .zip. Your skills live in your own private GitHub repo and install into Claude Code or Codex with one command:
npx skills add https://github.com/<you>/<repo>.git --all -g
Kipt is not affiliated with Next Level Builder or the UI UX Pro Max project.
Similar skills
- Frontend design skill: Anthropic's skill for distinctive visual direction, with no database or scripts.
- Design taste frontend skill: another take on steering agents away from generic UI.
- Impeccable skill: one design skill with 24 commands and a deterministic anti-pattern detector.
- Web design guidelines skill: Vercel's audit of UI code against its interface rules.