UI UX Pro Max

一项为跨多平台和框架构建专业 UI/UX 提供设计智能的 AI 技能。

概述

UI UX Pro Max 是一个可搜索的数据库，包含 UI 样式、配色方案、字体配对、图表类型、产品推荐、UX 指南以及特定技术栈的最佳实践。它可作为 AI 编码助手（Claude Code、Codex、Cursor、Windsurf 等）的一项技能/工作流使用。

功能特性

• 57 种 UI 样式 - 玻璃态、粘土态、极简主义、粗野主义、新拟态、便当网格、深色模式等
• 95 种配色方案 - 针对 SaaS、电子商务、医疗保健、金融科技、美容等行业的特定方案
• 56 种字体配对 - 精心策划的字体组合，附带 Google Fonts 导入
• 24 种图表类型 - 适用于仪表板和分析的推荐图表
• 10 种技术栈 - React、Next.js、Vue、Nuxt.js、Nuxt UI、Svelte、SwiftUI、React Native、Flutter、HTML+Tailwind
• 98 条 UX 指南 - 最佳实践、反模式和无障碍规则

安装

使用 CLI（推荐）

# 全局安装 CLI
npm install -g uipro-cli

# 进入你的项目目录
cd /path/to/your/project

# 为你的 AI 助手安装
uipro init --ai claude      # Claude Code
uipro init --ai cursor      # Cursor
uipro init --ai windsurf    # Windsurf
uipro init --ai antigravity # Antigravity (.agent + .shared)
uipro init --ai copilot     # GitHub Copilot
uipro init --ai kiro        # Kiro
uipro init --ai codex       # Codex (Skills)
uipro init --ai all         # 所有助手

其他 CLI 命令

uipro versions              # 列出可用版本
uipro update                # 更新到最新版本
uipro init --version v1.0.0 # 安装特定版本

手动安装

将相应的文件夹复制到你的项目中：

AI 助手	需要复制的文件夹
Claude Code	.claude/skills/ui-ux-pro-max/
Cursor	.cursor/commands/ui-ux-pro-max.md + .shared/ui-ux-pro-max/
Windsurf	.windsurf/workflows/ui-ux-pro-max.md + .shared/ui-ux-pro-max/
Antigravity	.agent/workflows/ui-ux-pro-max.md + .shared/ui-ux-pro-max/
GitHub Copilot	.github/prompts/ui-ux-pro-max.prompt.md + .shared/ui-ux-pro-max/
Kiro	.kiro/steering/ui-ux-pro-max.md + .shared/ui-ux-pro-max/
Codex	.codex/skills/ui-ux-pro-max/

先决条件

搜索脚本需要 Python 3.x。

# 检查 Python 是否已安装
python3 --version

# macOS
brew install python3

# Ubuntu/Debian
sudo apt update && sudo apt install python3

# Windows
winget install Python.Python.3.12

使用方法

Claude Code

当你请求 UI/UX 相关工作时，该技能会自动激活。只需自然聊天：

为我的 SaaS 产品构建一个落地页

Cursor / Windsurf / Antigravity

使用斜杠命令来调用该技能：

/ui-ux-pro-max 为我的 SaaS 产品构建一个落地页

Kiro

在聊天中输入 / 以查看可用命令，然后选择 ui-ux-pro-max：

/ui-ux-pro-max 为我的 SaaS 产品构建一个落地页

GitHub Copilot

在安装了 Copilot 的 VS Code 中，在聊天中输入 / 以查看可用提示，然后选择 ui-ux-pro-max：

/ui-ux-pro-max 为我的 SaaS 产品构建一个落地页

Codex CLI

对于 UI/UX 请求，该技能会自动激活。你也可以显式调用它：

$ui-ux-pro-max 为我的 SaaS 产品构建一个落地页

示例提示

为我的 SaaS 产品构建一个落地页

创建一个用于医疗保健分析的仪表板

设计一个带有深色模式的个人作品集网站

制作一个用于电子商务的移动应用 UI

工作原理

1. 你提问 - 请求任何 UI/UX 任务（构建、设计、创建、实现、审查、修复、改进）
2. 技能激活 - AI 自动在设计数据库中搜索相关的样式、颜色、排版和指南
3. 智能推荐 - 根据你的产品类型和需求，找到最佳匹配的设计系统
4. 代码生成 - 使用适当的颜色、字体、间距和最佳实践来实现 UI

支持的技术栈

该技能为以下技术栈提供特定指南：

• HTML + Tailwind（默认）
• React / Next.js
• Vue / Nuxt.js / Nuxt UI / Svelte
• SwiftUI / React Native / Flutter

只需在提示中提及你偏好的技术栈，或者让它默认使用 HTML + Tailwind。

Star 历史

许可证

本项目基于 MIT 许可证 授权。