UI Styling
Ohh-889/skyroc
Create beautiful, accessible user interfaces with shadcn/ui components (built on Radix UI + Tailwind), Tailwind CSS utility-first styling, and canvas-based visual designs.
当需要从产品与体验层面输出完整 UI/UX 方案（信息架构、视觉规范、交互策略、可用性检查）时使用. An agent skill from xrkseek/XRK-AGT.
Install UI UX Pro Max
$ npx skills add xrkseek/XRK-AGT --skill ui-ux-pro-max -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install xrkseek/XRK-AGT ui-ux-pro-max --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/xrkseek/XRK-AGT.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.cursor/skills/ui-ux-pro-max .claude/skills/ui-ux-pro-max && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "ui-ux-pro-max" agent skill from https://github.com/xrkseek/XRK-AGT/tree/main/.cursor/skills/ui-ux-pro-max into .claude/skills/ui-ux-pro-max/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ui-ux-pro-max", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/xrkseek/XRK-AGT/tree/main/.cursor/skills/ui-ux-pro-maxType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add xrkseek/XRK-AGT --skill ui-ux-pro-max -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install xrkseek/XRK-AGT ui-ux-pro-max --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/xrkseek/XRK-AGT.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.cursor/skills/ui-ux-pro-max .agents/skills/ui-ux-pro-max && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "ui-ux-pro-max" agent skill from https://github.com/xrkseek/XRK-AGT/tree/main/.cursor/skills/ui-ux-pro-max into .agents/skills/ui-ux-pro-max/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ui-ux-pro-max", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add xrkseek/XRK-AGT --skill ui-ux-pro-max -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install xrkseek/XRK-AGT ui-ux-pro-max --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/xrkseek/XRK-AGT.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.cursor/skills/ui-ux-pro-max .cursor/skills/ui-ux-pro-max && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "ui-ux-pro-max" agent skill from https://github.com/xrkseek/XRK-AGT/tree/main/.cursor/skills/ui-ux-pro-max into .cursor/skills/ui-ux-pro-max/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ui-ux-pro-max", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/xrkseek/XRK-AGT.git --path .cursor/skills/ui-ux-pro-max--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add xrkseek/XRK-AGT --skill ui-ux-pro-max -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install xrkseek/XRK-AGT ui-ux-pro-max --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/xrkseek/XRK-AGT.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.cursor/skills/ui-ux-pro-max .gemini/skills/ui-ux-pro-max && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "ui-ux-pro-max" agent skill from https://github.com/xrkseek/XRK-AGT/tree/main/.cursor/skills/ui-ux-pro-max into .gemini/skills/ui-ux-pro-max/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ui-ux-pro-max", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install xrkseek/XRK-AGT ui-ux-pro-maxInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add xrkseek/XRK-AGT --skill ui-ux-pro-max -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/xrkseek/XRK-AGT.git skills-src && mkdir -p .github/skills && cp -r skills-src/.cursor/skills/ui-ux-pro-max .github/skills/ui-ux-pro-max && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "ui-ux-pro-max" agent skill from https://github.com/xrkseek/XRK-AGT/tree/main/.cursor/skills/ui-ux-pro-max into .github/skills/ui-ux-pro-max/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ui-ux-pro-max", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add xrkseek/XRK-AGT --skill ui-ux-pro-max -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install xrkseek/XRK-AGT ui-ux-pro-max --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/xrkseek/XRK-AGT.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.cursor/skills/ui-ux-pro-max .opencode/skills/ui-ux-pro-max && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "ui-ux-pro-max" agent skill from https://github.com/xrkseek/XRK-AGT/tree/main/.cursor/skills/ui-ux-pro-max into .opencode/skills/ui-ux-pro-max/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "ui-ux-pro-max", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
ui-ux-pro-max- GitHub stars
- 138
- Token cost
- ~173 tokens
- SKILL.md length
- 32 words
- Files
- 29 (incl. scripts)
- Skills in repo
- 12
- Repo updated
- First seen
- Licence
- MIT
At a glance
当需要从产品与体验层面输出完整 UI/UX 方案（信息架构、视觉规范、交互策略、可用性检查）时使用. An agent skill from xrkseek/XRK-AGT.
- Works in 5 steps: 明确目标用户、业务目标、关键任务流与约束（设备/性能/无障碍）。 → 产出页面级结构建议：信息层级、主次操作、关键反馈点。 → 结合数据目录给出设计令牌建议：色彩、字体、间距、组件状态。 → …
- Tasks that involve UI design
- SKILL.md covers 权威入口, 适用场景, 非适用场景 and 执行步骤, plus 1 more section
What it does
UI UX Pro Max is an agent skill from xrkseek/XRK-AGT. 当需要从产品与体验层面输出完整 UI/UX 方案（信息架构、视觉规范、交互策略、可用性检查）时使用。
Its SKILL.md is about 170 tokens, which your agent loads only when the skill is triggered. The skill folder holds 30 other files, including scripts.
It sits in Frontend & Design, covering UI design. The repository describes itself as: 这是基于多语言所搭建的基于web，工作流，新型算法组件的智能体. The licence is MIT.
When your agent uses it
- Tasks that involve UI design
Example prompts
- “/ui-ux-pro-max”
Workflow steps
5 steps, taken from the first numbered list in SKILL.md.
- 明确目标用户、业务目标、关键任务流与约束（设备/性能/无障碍）。
- 产出页面级结构建议：信息层级、主次操作、关键反馈点。
- 结合数据目录给出设计令牌建议：色彩、字体、间距、组件状态。
- 补充交互细节：加载、空态、错误态、成功反馈、动效节奏。
- 给出验收清单：可读性、可点性、键盘可达、响应式、暗色模式一致性。
What it can do on your machine
Read from SKILL.md and the folder at commit 63f004e. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
Ships 1 file in scripts/, which the agent can run.
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Context cost
UI UX Pro Max loads about 173 tokens when it runs. Until then it costs about 16 tokens; SKILL.md has 32 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check passed
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); the scripts in this folder are not scanned.
SKILL.md
The full file from xrkseek/XRK-AGT at commit 63f004e, republished under its MIT licence (© xrkseek). 32 words, ~173 tokens.
Download SKILL.mdSave it as
.claude/skills/ui-ux-pro-max/SKILL.md (or your agent's skills folder). This skill also uses 28 other files; get the full folder from GitHub.- name
- ui-ux-pro-max
- description
- 当需要从产品与体验层面输出完整 UI/UX 方案（信息架构、视觉规范、交互策略、可用性检查）时使用。
权威入口
- 技能数据目录：
.cursor/skills/ui-ux-pro-max/data/ - 技能脚本目录：
.cursor/skills/ui-ux-pro-max/scripts/ - 项目规则：
.cursor/rules/xrk-project.mdc
适用场景
- 需要从需求到界面落地的完整 UI/UX 设计方案。
- 需要为页面/功能建立视觉与交互一致性规则。
- 需要对现有界面做可用性与可访问性改进建议。
非适用场景
- 不用于安装系统依赖、修改操作系统环境或执行部署命令。
- 不替代具体业务技能（如
xrk-http-api、xrk-tasker）的代码定位工作。
执行步骤
- 明确目标用户、业务目标、关键任务流与约束（设备/性能/无障碍）。
- 产出页面级结构建议：信息层级、主次操作、关键反馈点。
- 结合数据目录给出设计令牌建议：色彩、字体、间距、组件状态。
- 补充交互细节：加载、空态、错误态、成功反馈、动效节奏。
- 给出验收清单：可读性、可点性、键盘可达、响应式、暗色模式一致性。
常见陷阱
- 只给视觉风格，不给任务流与状态设计，导致“好看但不可用”。
- 忽略错误态与空态，导致产品完成度不足。
- 不区分“全局规范”和“页面局部例外”，导致设计系统失控。
© xrkseek, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Files
SKILL.md and 28 other files (scripts) in .cursor/skills/ui-ux-pro-max of xrkseek/XRK-AGT.
- SKILL.md
- data/charts.csv
- data/colors.csv
- data/icons.csv
- data/landing.csv
- data/products.csv
- data/react-performance.csv
- data/stacks/astro.csv
- data/stacks/flutter.csv
- data/stacks/html-tailwind.csv
- data/stacks/jetpack-compose.csv
- data/stacks/nextjs.csv
- data/stacks/nuxt-ui.csv
- data/stacks/nuxtjs.csv
- data/stacks/react-native.csv
- data/stacks/react.csv
- data/stacks/shadcn.csv
- data/stacks/svelte.csv
- data/stacks/swiftui.csv
- … and 10 more
Open the folder on GitHubat commit 63f004e
Compare with similar skills
UI UX Pro Max next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| UI UX Pro Max this skillxrkseek/XRK-AGT | 138 | — | ~173 | Automated safety check: Pass | MIT | |
| UI StylingOhh-889/skyroc | 795 | 13 repos | ~2.5k | Automated safety check: Pass | MIT | |
| LobeHub Interactive Prototypelobehub/lobehub | 83k | — | ~1.6k | Automated safety check: Pass | Custom licence | |
| Make Interfaces Feel Bettersamuelclay/NewsBlur | 7.6k | 10 repos | ~1.5k | Automated safety check: Pass | MIT | |
| UI UX Pro MaxZxBing0066/pixel-converter | 181 | 13 repos | ~2.6k | Automated safety check: Notes | BSD-2-Clause | |
| Design Dnazanwei/design-dna | 1.9k | 1 repos | ~2.1k | Automated safety check: Pass | MIT |
Similar skills
LobeHub Interactive Prototype
lobehub/lobehub
Builds single-file interactive HTML prototypes rendered with the real LobeHub UI components and written as production-style React, so they can later be split into files.
Make Interfaces Feel Better
samuelclay/NewsBlur
Design engineering principles for making interfaces feel polished.
UI UX Pro Max
ZxBing0066/pixel-converter
UI/UX design intelligence with searchable database. An agent skill from ZxBing0066/pixel-converter.
Design Dna
zanwei/design-dna
Extract, define, and apply design DNA across three dimensions: design system (tokens), design style (qualitative feel), and visual effects (Canvas, WebGL, 3D, particles, shaders, scroll effects…
Figma Design to Code
warpdotdev/warp
Turns a Figma frame or component into production code that matches the design, using the Figma MCP server and the project's own design system.
More from xrkseek/XRK-AGT
All 12 skills in this repoImmersive Short Video
xrkseek/XRK-AGT
Produce immersive vertical short videos (口播/科普/产品讲解) without AI-slop aesthetics.
Xrk Crawl
xrkseek/XRK-AGT
当你需要开发/排查 HTTP 抓取、SSRF、Playwright 受控浏览器、本地字体增强截图，或判断 webfetch 与 browser 工作流如何选型时使用。
Xrk HTTP API
xrkseek/XRK-AGT
当你需要开发或排查 HTTP API（core//http/.js）、理解 HttpApi 基类、HttpApiLoader、业务层约定时使用。
Xrk Node Runtime
xrkseek/XRK-AGT
编写或审查 core/src 代码时，确保使用 Node 26 稳定 API，禁止旧写法（fetch/exec/错误/二进制）。AI 改 Core 前必读。
Xrk GitHub Research
xrkseek/XRK-AGT
在 GitHub 搜索成熟开源实现、对比方案、读 issue/PR 时使用。架构选型、unfamiliar 领域、找业界最佳实践时主动调用。
Xrk LLM
xrkseek/XRK-AGT
当你需要配置/新增/排查 LLM 提供商（OpenAI/Azure/Gemini/Anthropic/Ollama/各类兼容网关）时使用；确保 YAML/Schema/代码一致。
Related
Categories
Questions about UI UX Pro Max
What does UI UX Pro Max do?
当需要从产品与体验层面输出完整 UI/UX 方案（信息架构、视觉规范、交互策略、可用性检查）时使用. An agent skill from xrkseek/XRK-AGT. UI UX Pro Max is an agent skill from xrkseek/XRK-AGT.
When should I use UI UX Pro Max?
UI UX Pro Max fits situations like: tasks that involve UI design.
How do I install UI UX Pro Max in Claude Code?
Run `npx skills add xrkseek/XRK-AGT --skill ui-ux-pro-max -a claude-code`. Or copy the skill folder (.cursor/skills/ui-ux-pro-max in xrkseek/XRK-AGT) into .claude/skills/ui-ux-pro-max in your project. Claude Code loads it when a task matches its description.
How do I install UI UX Pro Max in Codex?
Run `npx skills add xrkseek/XRK-AGT --skill ui-ux-pro-max -a codex`. Or copy the skill folder (.cursor/skills/ui-ux-pro-max in xrkseek/XRK-AGT) into .agents/skills/ui-ux-pro-max in your project. Codex loads it when a task matches its description.
Can I use UI UX Pro Max in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add xrkseek/XRK-AGT --skill ui-ux-pro-max -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/ui-ux-pro-max, .gemini/skills/ui-ux-pro-max, .github/skills/ui-ux-pro-max and .opencode/skills/ui-ux-pro-max in your project.
What does UI UX Pro Max need to run?
SKILL.md names no scripts, command-line tools or credentials: UI UX Pro Max is instructions for the agent only.
Does UI UX Pro Max access the network?
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Is UI UX Pro Max safe to install?
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.
What licence does UI UX Pro Max use?
UI UX Pro Max is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does UI UX Pro Max use?
About 173 tokens (SKILL.md is roughly 692 characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
What are the alternatives to UI UX Pro Max?
Skills that share tags, products or a category with UI UX Pro Max: UI Styling (Ohh-889/skyroc, 795 stars), LobeHub Interactive Prototype (lobehub/lobehub, 83k stars), Make Interfaces Feel Better (samuelclay/NewsBlur, 7.6k stars) and UI UX Pro Max (ZxBing0066/pixel-converter, 181 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains UI UX Pro Max?
xrkseek (a GitHub user) maintains it in xrkseek/XRK-AGT, which has 138 GitHub stars. The repository holds 12 skills in this directory. The repository was last updated on October 1, 2026.
Source: xrkseek/XRK-AGT on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.