Questions? hello@viberation.devGet supportBlogDocsChangelog

Colour mode

XGitHub
Get started

UI/UX Pro Max

Skills#design#frontend

Searchable design knowledge your agent can draw on.

A skill that gives an agent databases of UI styles, colour palettes, font pairings and UX guidelines to choose from while building an interface. Free core, with a paid tier for brand assets.

Install this skill

npx skills add https://github.com/nextlevelbuilder/ui-ux-pro-max-skill --skill ui-ux-pro-max

Runs the open-source skills CLI in your own terminal. It asks which agents to add the skill to. Read what it tells your agent to do before you install it.

Download skill (.zip)

Install for your agent

  • Claude Code

    Run this in your project

    npx skills add https://github.com/nextlevelbuilder/ui-ux-pro-max-skill --skill ui-ux-pro-max -a claude-code

    Add -g to install it for every project instead.

    Or ask Claude Code to do it

    Install the "ui-ux-pro-max" skill from https://github.com/nextlevelbuilder/ui-ux-pro-max-skill for Claude Code.
Copy the skill folder (the one containing SKILL.md, with any scripts or reference files next to it) into .claude/skills/ in this project.
Before copying, show me the SKILL.md and list any scripts it includes, and wait for me to confirm.

    Or copy the folder yourself

    Unzip the download into .claude/skills/ for this project, or ~/.claude/skills/ for all your projects.

    Picked up in the current session, no restart needed.

    Claude Code skills docs
  • Claude.ai

    Upload the ZIP

    1. In Settings > Capabilities, turn on Code execution and file creation.
    2. Go to Customize > Skills, press +, then Create skill.
    3. Choose Upload a skill and pick the ZIP you downloaded.

    Free, Pro and Max plans. On Team and Enterprise, an owner turns skills on in Organization settings first.

    Claude.ai skills docs
  • ChatGPT

    Upload the ZIP

    1. Open Skills in ChatGPT and select Create.
    2. Select Upload from your computer and pick the ZIP you downloaded.
    3. Wait for ChatGPT's safety scan. A skill marked Needs Review asks you to check it before use.

    Skills that rely on scripts or a terminal may not work unchanged in ChatGPT.

    ChatGPT skills docs
  • Codex

    Run this in your project

    npx skills add https://github.com/nextlevelbuilder/ui-ux-pro-max-skill --skill ui-ux-pro-max -a codex

    Add -g to install it for every project instead.

    Or ask Codex to do it

    Install the "ui-ux-pro-max" skill from https://github.com/nextlevelbuilder/ui-ux-pro-max-skill for Codex.
Copy the skill folder (the one containing SKILL.md, with any scripts or reference files next to it) into .agents/skills/ in this project.
Before copying, show me the SKILL.md and list any scripts it includes, and wait for me to confirm.

    Or copy the folder yourself

    Unzip the download into .agents/skills/ for this project, or ~/.agents/skills/ for all your projects.

    Restart Codex if the skill does not show up.

    Codex skills docs
  • Cursor

    Run this in your project

    npx skills add https://github.com/nextlevelbuilder/ui-ux-pro-max-skill --skill ui-ux-pro-max -a cursor

    Add -g to install it for every project instead.

    Or ask Cursor to do it

    Install the "ui-ux-pro-max" skill from https://github.com/nextlevelbuilder/ui-ux-pro-max-skill for Cursor.
Copy the skill folder (the one containing SKILL.md, with any scripts or reference files next to it) into .cursor/skills/ in this project.
Before copying, show me the SKILL.md and list any scripts it includes, and wait for me to confirm.

    Or copy the folder yourself

    Unzip the download into .cursor/skills/ for this project, or ~/.cursor/skills/ for all your projects.

    Run it by typing / and the skill name in chat.

    Cursor skills docs
  • GitHub Copilot

    Run this in your project

    npx skills add https://github.com/nextlevelbuilder/ui-ux-pro-max-skill --skill ui-ux-pro-max -a github-copilot

    Add -g to install it for every project instead.

    Or ask GitHub Copilot to do it

    Install the "ui-ux-pro-max" skill from https://github.com/nextlevelbuilder/ui-ux-pro-max-skill for GitHub Copilot.
Copy the skill folder (the one containing SKILL.md, with any scripts or reference files next to it) into .github/skills/ in this project.
Before copying, show me the SKILL.md and list any scripts it includes, and wait for me to confirm.

    Or copy the folder yourself

    Unzip the download into .github/skills/ for this project, or ~/.copilot/skills/ for all your projects.

    Works in Copilot CLI, the cloud agent and agent mode in VS Code and JetBrains.

    GitHub Copilot skills docs
  • Antigravity

    Run this in your project

    npx skills add https://github.com/nextlevelbuilder/ui-ux-pro-max-skill --skill ui-ux-pro-max -a antigravity

    Add -g to install it for every project instead.

    Or ask Antigravity to do it

    Install the "ui-ux-pro-max" skill from https://github.com/nextlevelbuilder/ui-ux-pro-max-skill for Antigravity.
Copy the skill folder (the one containing SKILL.md, with any scripts or reference files next to it) into .agents/skills/ in this project.
Before copying, show me the SKILL.md and list any scripts it includes, and wait for me to confirm.

    Or copy the folder yourself

    Unzip the download into .agents/skills/ for this project, or ~/.gemini/config/skills/ for all your projects.

    Antigravity skills docs
  • Gemini CLI

    Run this in your project

    npx skills add https://github.com/nextlevelbuilder/ui-ux-pro-max-skill --skill ui-ux-pro-max -a gemini-cli

    Add -g to install it for every project instead.

    Or ask Gemini CLI to do it

    Install the "ui-ux-pro-max" skill from https://github.com/nextlevelbuilder/ui-ux-pro-max-skill for Gemini CLI.
Copy the skill folder (the one containing SKILL.md, with any scripts or reference files next to it) into .gemini/skills/ in this project.
Before copying, show me the SKILL.md and list any scripts it includes, and wait for me to confirm.

    Or copy the folder yourself

    Unzip the download into .gemini/skills/ for this project, or ~/.gemini/skills/ for all your projects.

    Run /skills to check it was found.

    Gemini CLI skills docs
Installs
360K via skills.sh
GitHub
128.3K stars ↗
Last updated
15 Sept 2026
Licence
MIT

Security checks

Run by independent scanners and published on skills.sh. Their results, not a Viberation review.

  • Gen Agent Trust Hub Pass

    The skill is safe. It provides UI/UX design intelligence using local data and includes a feature to persist results to the local filesystem with proper sanitization. It uses only Python standard libraries and its test suite executes internal scripts safely.

    15 Sept 2026

  • Socket Pass

    No alerts

    15 Sept 2026

  • Snyk Pass

    Risk: LOW · No issues

    15 Sept 2026

  • Runlayer Pass

    3 files scanned · No issues

    10 Mar 2026

  • ZeroLeaks Pass

    1 finding · Score: 86/100

    16 Apr 2026
What's inside (71 files)
  • data/app-interface.csv11K chars
  • data/catalog-summary.json2.4K chars
  • data/charts.csv23.3K chars
  • data/colors.csv37.9K chars
  • data/data-provenance.json36.7K chars
  • data/google-font-licenses.json432.8K chars
  • data/icons.csv57.9K chars
  • data/landing.csv25.4K chars
  • data/motion.csv14.7K chars
  • data/products.csv75.6K chars
  • data/react-performance.csv15.1K chars
  • data/stacks/angular.csv19.9K chars
  • data/stacks/astro.csv14.6K chars
  • data/stacks/avalonia.csv27.3K chars
  • data/stacks/flutter.csv14.2K chars
  • data/stacks/html-tailwind.csv16.6K chars
  • data/stacks/javafx.csv33.6K chars
  • data/stacks/jetpack-compose.csv12.3K chars
  • data/stacks/laravel.csv20.1K chars
  • data/stacks/nextjs.csv18.7K chars
  • data/stacks/nuxt-ui.csv24.1K chars
  • data/stacks/nuxtjs.csv23K chars
  • data/stacks/react-native.csv14K chars
  • data/stacks/react.csv19K chars
  • data/stacks/shadcn.csv23.2K chars
  • data/stacks/svelte.csv15.1K chars
  • data/stacks/swiftui.csv15.3K chars
  • data/stacks/threejs.csv45.9K chars
  • data/stacks/uno.csv30.1K chars
  • data/stacks/uwp.csv24.7K chars
  • data/stacks/vue.csv12.8K chars
  • data/stacks/winui.csv27.9K chars
  • data/stacks/wpf.csv24.2K chars
  • data/styles.csv148K chars
  • data/typography.csv49.9K chars
  • data/ui-reasoning.csv77.4K chars
  • data/ux-guidelines.csv27.5K chars
  • references/pro-rules.md10.9K chars
  • references/quick-reference.md24.5K chars
  • scripts/core.py41.2K chars
  • scripts/design_system.py70.7K chars
  • scripts/reasoning_contract.py5.8K chars
  • scripts/search.py9.4K chars
  • scripts/tests/fixtures/catalogs/google-api.json1.1K chars
  • scripts/tests/fixtures/catalogs/google-catalog.json1.8K chars
  • scripts/tests/fixtures/catalogs/google-existing.csv480 chars
  • scripts/tests/fixtures/catalogs/google-metadata.json328 chars
  • scripts/tests/fixtures/catalogs/google-overrides.json97 chars
  • scripts/tests/fixtures/catalogs/icons-curated.csv495 chars
  • scripts/tests/fixtures/catalogs/phosphor-core.json571 chars
  • scripts/tests/fixtures/catalogs/phosphor-package.json370 chars
  • scripts/tests/fixtures/catalogs/phosphor-react-exports.json87 chars
  • scripts/tests/fixtures/catalogs/phosphor-react-package.json81 chars
  • scripts/tests/fixtures/relevance-baseline.json89.4K chars
  • scripts/tests/fixtures/relevance-cases.json36.7K chars
  • scripts/tests/fixtures/relevance-thresholds.json5.1K chars
  • scripts/tests/test_catalog_refresh.py19.5K chars
  • scripts/tests/test_catalog_summary_line_endings.py2.9K chars
  • scripts/tests/test_core_data_quality.py9K chars
  • scripts/tests/test_core.py16.7K chars
  • scripts/tests/test_data_contracts.py19.5K chars
  • scripts/tests/test_design_system_mode.py7.7K chars
  • scripts/tests/test_design_system_stack.py2.3K chars
  • scripts/tests/test_native_desktop_stack_freshness.py8.2K chars
  • scripts/tests/test_relevance_evaluator.py8.4K chars
  • scripts/tests/test_skill_script_paths.py4.3K chars
  • scripts/tests/test_style_taxonomy.py7.4K chars
  • scripts/tests/test_text_layout_resilience.py5.9K chars
  • scripts/tests/test_web_stack_freshness.py7.7K chars
  • scripts/validate_data.py52.2K chars
  • SKILL.md15.9K chars

SKILL.md, first part. Shown as plain text.

---
name: ui-ux-pro-max
description: "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."
---

# UI/UX Pro Max - Design Intelligence

Searchable local UI/UX guidance: 79 searchable styles (50 active), 192 product palettes and exact reasoning profiles, 74 font pairings, 119 UX guidelines, 105 curated icons, 17 GSAP presets, 25 chart types, and 22 technology stacks.

## When to Apply

Use this Skill when the task involves **UI structure, visual design decisions, interaction patterns, or user experience quality control**: designing new pages, creating/refactoring UI components, choosing color/typography/spacing/layout systems, reviewing UI for UX/accessibility/consistency, implementing navigation/animation/responsive behavior, or improving perceived quality and usability.

Skip it for pure backend logic, API/database design, non-visual performance work, infrastructure/DevOps, or non-visual scripts — unless the task changes how something **looks, feels, moves, or is interacted with**.

## Rule Categories by Priority

*Follow priority 1→10 to decide which category to focus on first; use `--domain <Domain>` to query full details. The full rule text for every category lives in `references/quick-reference.md` — read it on demand rather than loading it every time.*

| Priority | Category | Impact | Domain | Key Checks (Must Have) | Anti-Patterns (Avoid) |
|----------|----------|--------|--------|------------------------|------------------------|
| 1 | Accessibility | CRITICAL | `ux` | Contrast 4.5:1, Alt text, Keyboard nav, Aria-labels | Removing focus rings, Icon-only buttons without labels |
| 2 | Touch & Interaction | CRITICAL | `ux` | Min size 44×44px, 8px+ spacing, Loading feedback | Reliance on hover only, Instant state changes (0ms) |
| 3 | Performance | HIGH | `ux` | WebP/AVIF, Lazy loading, Reserve space (CLS &lt; 0.1) | Layout thrashing, Cumulative Layout Shift |
| 4 | Style Selection | HIGH | `style`, `product` | Match product type, Consistency, SVG icons (no emoji) | Mixing flat & skeuomorphic randomly, Emoji as icons |
| 5 | Layout & Responsive | HIGH | `ux` | Mobile-first breakpoints, Viewport meta, No horizontal scroll | Horizontal scroll, Fixed px container widths, Disable zoom |
| 6 | Typography & Color | MEDIUM | `typography`, `color` | Base 16px, Line-height 1.5, Semantic color tokens | Text &lt; 12px body, Gray-on-gray, Raw hex in components |
| 7 | Animation | MEDIUM | `ux`, `gsap` | Context-aware timing, Motion conveys meaning, Spatial continuity | One duration for every transition, Animating width/height, No reduced-motion |
| 8 | Forms & Feedback | MEDIUM | `ux` | Visible labels, Error near field, Helper text, Progressive disclosure | Placeholder-only label, Errors only at top, Overwhelm upfront |
| 9 | Navigation Patterns | HIGH | `ux` | Predictable back, Bottom nav ≤5, Deep linking | Overloaded nav, Broken back behavior, No deep links |
| 10 | Charts & Data | LOW | `chart` | Legends, Tooltips, Accessible colors | Relying on color alone to convey meaning |

For the full rule list per category (all 119 UX guidelines with rationale), read `references/quick-reference.md`. For app-specific polish rules (icons, touch feedback, dark mode contrast, safe areas) and the canonical pre-delivery checklist, read `references/pro-rules.md`.

---

## Running the search tool

The search script lives inside this skill's own directory, not the project directory. Always invoke it by its full path — do not assume a particular working directory:

```bash
python "${CLAUDE_PLUGIN_ROOT}/.claude/skil

Works with

Key info

Pricing
Freemium
Category
Skills
Skill category
Design & UI
Works in
Every agent listed here, including Claude.ai and ChatGPT
Best for
Beginner
Made by
nextlevelbuilder (community)
Use it when
You want your agent to pick styles, palettes and fonts from a large design library

More in Skills