Borrowing it
Nothing to install: this file belongs to Ohh-889/skyroc. Take a copy, put it at the same path in your own repository, and replace the rules that are about this project with yours.
curl -O https://raw.githubusercontent.com/Ohh-889/skyroc/master/.agents/skills/ui-ux-pro-max/SKILL.mdgit clone --depth 1 https://github.com/Ohh-889/skyrocWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/ohh-889/skyroc/ui-ux-pro-max)<a href="https://agentmods.dev/skills/ohh-889/skyroc/ui-ux-pro-max"><img src="https://agentmods.dev/badge/skills/ohh-889/skyroc/ui-ux-pro-max/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/ohh-889/skyroc/ui-ux-pro-max"><img src="https://agentmods.dev/badge/skills/ohh-889/skyroc/ui-ux-pro-max.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00114 | $0.13011 |
| Opus 5 | $0.00057 | $0.06506 |
| Sonnet 5 | $0.00023 | $0.02602 |
| Haiku 4.5 | $0.00011 | $0.01301 |
Grade A, and why
ui-ux-pro-max scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 10d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
This is a copy
78% identical to ui-ux-pro-max — 321 lines differ, which has more behind it and is treated as the original. This page carries a canonical link to it rather than competing with it.
How it starts
The opening of the file, as written. The whole thing — 740 lines — stays where its author put it; the contents beside it link to each section on GitHub.
ui-ux-pro-max
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.
When to Apply
当任务涉及 UI 结构、视觉设计决策、交互模式或用户体验质量控制 时，应使用此 Skill。
Primary Use Cases
在以下情况此 Skill 最为有用：
- 设计新的页面（Landing Page、Dashboard、Admin、SaaS、Mobile App）
- 创建或重构 UI 组件（按钮、弹窗、表单、表格、图表等）
- 选择配色方案、字体系统、间距规范或布局体系
- 审查 UI 代码的用户体验、可访问性或视觉一致性
- 实现导航结构、动效或响应式行为
- 做产品层级的设计决策（风格、信息层级、品牌表达）
- 提升界面的感知质量、清晰度或可用性
Recommended
在以下情况建议使用此 Skill：
- UI 看起来"不够专业"，但原因不明确
- 收到可用性或体验方面的反馈
- 准备上线前的 UI 质量优化
- 需要对齐跨平台设计（Web / iOS / Android）
- 构建设计系统或可复用组件库
Skip
在以下情况无需使用此 Skill：
- 纯后端逻辑开发
- 仅涉及 API 或数据库设计
- 与界面无关的性能优化
- 基础设施或 DevOps 工作
- 非视觉类脚本或自动化任务
判断准则：如果任务会改变某个功能 看起来如何、使用起来如何、如何运动或如何被交互，就应该使用此 Skill。
Rule Categories by Priority
供人工/AI 查阅：按 1→10 决定先关注哪类规则；需要细则时用 --domain <Domain> 查询。脚本不读取本表。
| 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 < 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 < 12px body, Gray-on-gray, Raw hex in components |
| 7 | Animation | MEDIUM | ux |
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 |
What ships with it
60 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
- data/app-interface.csv 11 KB
- data/catalog-summary.json 2.3 KB
- data/charts.csv 23 KB
- data/colors.csv 37 KB
- data/data-provenance.json 36 KB
- data/google-font-licenses.json 423 KB
- data/google-fonts.csv 730 KB
- data/icons.csv 57 KB
- data/landing.csv 25 KB
- data/motion.csv 14 KB
- data/phosphor-icons-upstream.json 805 KB
- data/products.csv 74 KB
- data/react-performance.csv 15 KB
- data/stacks/angular.csv 19 KB
- data/stacks/astro.csv 14 KB
- data/stacks/avalonia.csv 27 KB
- data/stacks/flutter.csv 14 KB
- data/stacks/html-tailwind.csv 16 KB
- data/stacks/javafx.csv 33 KB
- data/stacks/jetpack-compose.csv 12 KB
- data/stacks/laravel.csv 20 KB
- data/stacks/nextjs.csv 18 KB
- data/stacks/nuxt-ui.csv 24 KB
- data/stacks/nuxtjs.csv 22 KB
- data/stacks/react-native.csv 14 KB
- data/stacks/react.csv 19 KB
- data/stacks/shadcn.csv 23 KB
- data/stacks/svelte.csv 15 KB
- data/stacks/swiftui.csv 15 KB
- data/stacks/threejs.csv 45 KB
- data/stacks/uno.csv 29 KB
- data/stacks/uwp.csv 24 KB
- data/stacks/vue.csv 13 KB
- data/stacks/winui.csv 27 KB
- data/stacks/wpf.csv 24 KB
- data/styles.csv 146 KB
- data/typography.csv 49 KB
- data/ui-reasoning.csv 76 KB
- data/ux-guidelines.csv 27 KB
- scripts/__pycache__/core.cpython-314.pyc 49 KB
- scripts/__pycache__/design_system.cpython-314.pyc 98 KB
- scripts/core.py 40 KB runs code
- scripts/design_system.py 69 KB runs code
- scripts/reasoning_contract.py 5.7 KB runs code
- scripts/search.py 8.9 KB runs code
- scripts/tests/fixtures/catalogs/google-api.json 1.1 KB
- scripts/tests/fixtures/catalogs/google-catalog.json 1.7 KB
- scripts/tests/fixtures/catalogs/google-existing.csv 480 B
- scripts/tests/fixtures/catalogs/google-metadata.json 328 B
- scripts/tests/fixtures/catalogs/google-overrides.json 97 B
- scripts/tests/fixtures/catalogs/icons-curated.csv 495 B
- scripts/tests/fixtures/catalogs/phosphor-core.json 571 B
- scripts/tests/fixtures/catalogs/phosphor-package.json 370 B
- scripts/tests/fixtures/catalogs/phosphor-react-exports.json 87 B
- scripts/tests/fixtures/catalogs/phosphor-react-package.json 81 B
- scripts/tests/fixtures/relevance-baseline.json 87 KB
- scripts/tests/fixtures/relevance-cases.json 36 KB
- scripts/tests/fixtures/relevance-thresholds.json 5.0 KB
- scripts/tests/test_catalog_refresh.py 19 KB runs code
- scripts/tests/test_core_data_quality.py 8.7 KB runs code
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 10d ago First seen · 740 lines · 114 tokens per session scan A e5baf9400d43
ui-ux-pro-max is a skill published in the GitHub repository Ohh-889/skyroc (792 stars, last pushed 8d ago), licensed MIT. It adds 114 tokens to every session and 13,011 once invoked, about $0.0006 per session on Opus 5. A static security scan graded it A with 0 findings. It is 78% identical to ui-ux-pro-max, differing in 321 lines, and is treated as a copy.
Other skills, from other repositories
antd
Use when the user's task involves Ant Design (antd) — writing antd components, debugging antd issues, querying antd APIs/props/tokens/demos, migrating between antd versions, or analyzing antd usage in a project. Triggers on antd-related code, imports from 'antd', or explicit antd questions.
pro-upgrade
An upgrade guide for projects built with Ant Design Pro, a React-based application template for business software. It compares the project with the latest official template and merges framework updates while preserving application code.
antd
Use when the user's task involves Ant Design (antd) — writing antd components, debugging antd issues, querying antd APIs/props/tokens/demos, migrating between antd versions, or analyzing antd usage in a project. Triggers on antd-related code, imports from 'antd', or explicit antd questions.
creative-tim-ui
Creative Tim UI block library assistant. Use when adding, generating, or modifying UI blocks/components/pages from creative-tim.com/ui. Covers design philosophy (minimalism, the 95% rule, research-first), block discovery, both CLI install methods, PRO API key setup, and Creative Tim design rules (orange brand…
cobejs
Use when adding a lightweight interactive globe with cobe (canvas setup, markers, interaction, performance, integration with React/Next.js).
stitch::react-components
Converts Stitch designs into modular Vite and React components, or syncs/updates existing React components to align with the latest Stitch designs, using system-level networking and AST-based validation.