Skill · em Criar imagem, vídeo e arte

ui-ux-pro-max

UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code.…

Procedência

Origem: davila7/claude-code-templates
Caminho: cli-tool/components/skills/creative-design/ui-ux-pro-max
Versão fixada: 57f899e5394bb8ca166f38eacae8f0853cbfe033
Licença: MIT
Espelhado em 25/09/2026
575 downloads no Claude Code Templates (lido em 25/09/2026)

Antes de instalar

27 arquivos · 415,6 KB · inclui 3 scripts que executam: scripts/core.py, scripts/design_system.py, scripts/search.py

Instalar na sua CLI

O comando baixa a versão fixada (commit 57f899e) direto da origem, para a pasta que a CLI lê. Precisa de curl (macOS e Linux); no Windows não há comando, porque o Rook Labs é para macOS.

Claude Code

Neste projeto: instala em .claude/skills/ui-ux-pro-max/.

d=".claude/skills/ui-ux-pro-max"
u="https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/skills/creative-design/ui-ux-pro-max"
curl -fsSL --create-dirs \
  -o "$d/SKILL.md" "$u/SKILL.md" \
  -o "$d/data/charts.csv" "$u/data/charts.csv" \
  -o "$d/data/colors.csv" "$u/data/colors.csv" \
  -o "$d/data/icons.csv" "$u/data/icons.csv" \
  -o "$d/data/landing.csv" "$u/data/landing.csv" \
  -o "$d/data/products.csv" "$u/data/products.csv" \
  -o "$d/data/prompts.csv" "$u/data/prompts.csv" \
  -o "$d/data/react-performance.csv" "$u/data/react-performance.csv" \
  -o "$d/data/stacks/flutter.csv" "$u/data/stacks/flutter.csv" \
  -o "$d/data/stacks/html-tailwind.csv" "$u/data/stacks/html-tailwind.csv" \
  -o "$d/data/stacks/nextjs.csv" "$u/data/stacks/nextjs.csv" \
  -o "$d/data/stacks/nuxt-ui.csv" "$u/data/stacks/nuxt-ui.csv" \
  -o "$d/data/stacks/nuxtjs.csv" "$u/data/stacks/nuxtjs.csv" \
  -o "$d/data/stacks/react-native.csv" "$u/data/stacks/react-native.csv" \
  -o "$d/data/stacks/react.csv" "$u/data/stacks/react.csv" \
  -o "$d/data/stacks/shadcn.csv" "$u/data/stacks/shadcn.csv" \
  -o "$d/data/stacks/svelte.csv" "$u/data/stacks/svelte.csv" \
  -o "$d/data/stacks/swiftui.csv" "$u/data/stacks/swiftui.csv" \
  -o "$d/data/stacks/vue.csv" "$u/data/stacks/vue.csv" \
  -o "$d/data/styles.csv" "$u/data/styles.csv" \
  -o "$d/data/typography.csv" "$u/data/typography.csv" \
  -o "$d/data/ui-reasoning.csv" "$u/data/ui-reasoning.csv" \
  -o "$d/data/ux-guidelines.csv" "$u/data/ux-guidelines.csv" \
  -o "$d/data/web-interface.csv" "$u/data/web-interface.csv" \
  -o "$d/scripts/core.py" "$u/scripts/core.py" \
  -o "$d/scripts/design_system.py" "$u/scripts/design_system.py" \
  -o "$d/scripts/search.py" "$u/scripts/search.py" \
  -o "$d/LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Global: instala em ~/.claude/skills/ui-ux-pro-max/.

d="$HOME/.claude/skills/ui-ux-pro-max"
u="https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/skills/creative-design/ui-ux-pro-max"
curl -fsSL --create-dirs \
  -o "$d/SKILL.md" "$u/SKILL.md" \
  -o "$d/data/charts.csv" "$u/data/charts.csv" \
  -o "$d/data/colors.csv" "$u/data/colors.csv" \
  -o "$d/data/icons.csv" "$u/data/icons.csv" \
  -o "$d/data/landing.csv" "$u/data/landing.csv" \
  -o "$d/data/products.csv" "$u/data/products.csv" \
  -o "$d/data/prompts.csv" "$u/data/prompts.csv" \
  -o "$d/data/react-performance.csv" "$u/data/react-performance.csv" \
  -o "$d/data/stacks/flutter.csv" "$u/data/stacks/flutter.csv" \
  -o "$d/data/stacks/html-tailwind.csv" "$u/data/stacks/html-tailwind.csv" \
  -o "$d/data/stacks/nextjs.csv" "$u/data/stacks/nextjs.csv" \
  -o "$d/data/stacks/nuxt-ui.csv" "$u/data/stacks/nuxt-ui.csv" \
  -o "$d/data/stacks/nuxtjs.csv" "$u/data/stacks/nuxtjs.csv" \
  -o "$d/data/stacks/react-native.csv" "$u/data/stacks/react-native.csv" \
  -o "$d/data/stacks/react.csv" "$u/data/stacks/react.csv" \
  -o "$d/data/stacks/shadcn.csv" "$u/data/stacks/shadcn.csv" \
  -o "$d/data/stacks/svelte.csv" "$u/data/stacks/svelte.csv" \
  -o "$d/data/stacks/swiftui.csv" "$u/data/stacks/swiftui.csv" \
  -o "$d/data/stacks/vue.csv" "$u/data/stacks/vue.csv" \
  -o "$d/data/styles.csv" "$u/data/styles.csv" \
  -o "$d/data/typography.csv" "$u/data/typography.csv" \
  -o "$d/data/ui-reasoning.csv" "$u/data/ui-reasoning.csv" \
  -o "$d/data/ux-guidelines.csv" "$u/data/ux-guidelines.csv" \
  -o "$d/data/web-interface.csv" "$u/data/web-interface.csv" \
  -o "$d/scripts/core.py" "$u/scripts/core.py" \
  -o "$d/scripts/design_system.py" "$u/scripts/design_system.py" \
  -o "$d/scripts/search.py" "$u/scripts/search.py" \
  -o "$d/LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Codex

Neste projeto: instala em .agents/skills/ui-ux-pro-max/.

d=".agents/skills/ui-ux-pro-max"
u="https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/skills/creative-design/ui-ux-pro-max"
curl -fsSL --create-dirs \
  -o "$d/SKILL.md" "$u/SKILL.md" \
  -o "$d/data/charts.csv" "$u/data/charts.csv" \
  -o "$d/data/colors.csv" "$u/data/colors.csv" \
  -o "$d/data/icons.csv" "$u/data/icons.csv" \
  -o "$d/data/landing.csv" "$u/data/landing.csv" \
  -o "$d/data/products.csv" "$u/data/products.csv" \
  -o "$d/data/prompts.csv" "$u/data/prompts.csv" \
  -o "$d/data/react-performance.csv" "$u/data/react-performance.csv" \
  -o "$d/data/stacks/flutter.csv" "$u/data/stacks/flutter.csv" \
  -o "$d/data/stacks/html-tailwind.csv" "$u/data/stacks/html-tailwind.csv" \
  -o "$d/data/stacks/nextjs.csv" "$u/data/stacks/nextjs.csv" \
  -o "$d/data/stacks/nuxt-ui.csv" "$u/data/stacks/nuxt-ui.csv" \
  -o "$d/data/stacks/nuxtjs.csv" "$u/data/stacks/nuxtjs.csv" \
  -o "$d/data/stacks/react-native.csv" "$u/data/stacks/react-native.csv" \
  -o "$d/data/stacks/react.csv" "$u/data/stacks/react.csv" \
  -o "$d/data/stacks/shadcn.csv" "$u/data/stacks/shadcn.csv" \
  -o "$d/data/stacks/svelte.csv" "$u/data/stacks/svelte.csv" \
  -o "$d/data/stacks/swiftui.csv" "$u/data/stacks/swiftui.csv" \
  -o "$d/data/stacks/vue.csv" "$u/data/stacks/vue.csv" \
  -o "$d/data/styles.csv" "$u/data/styles.csv" \
  -o "$d/data/typography.csv" "$u/data/typography.csv" \
  -o "$d/data/ui-reasoning.csv" "$u/data/ui-reasoning.csv" \
  -o "$d/data/ux-guidelines.csv" "$u/data/ux-guidelines.csv" \
  -o "$d/data/web-interface.csv" "$u/data/web-interface.csv" \
  -o "$d/scripts/core.py" "$u/scripts/core.py" \
  -o "$d/scripts/design_system.py" "$u/scripts/design_system.py" \
  -o "$d/scripts/search.py" "$u/scripts/search.py" \
  -o "$d/LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Global: instala em ~/.agents/skills/ui-ux-pro-max/.

d="$HOME/.agents/skills/ui-ux-pro-max"
u="https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/skills/creative-design/ui-ux-pro-max"
curl -fsSL --create-dirs \
  -o "$d/SKILL.md" "$u/SKILL.md" \
  -o "$d/data/charts.csv" "$u/data/charts.csv" \
  -o "$d/data/colors.csv" "$u/data/colors.csv" \
  -o "$d/data/icons.csv" "$u/data/icons.csv" \
  -o "$d/data/landing.csv" "$u/data/landing.csv" \
  -o "$d/data/products.csv" "$u/data/products.csv" \
  -o "$d/data/prompts.csv" "$u/data/prompts.csv" \
  -o "$d/data/react-performance.csv" "$u/data/react-performance.csv" \
  -o "$d/data/stacks/flutter.csv" "$u/data/stacks/flutter.csv" \
  -o "$d/data/stacks/html-tailwind.csv" "$u/data/stacks/html-tailwind.csv" \
  -o "$d/data/stacks/nextjs.csv" "$u/data/stacks/nextjs.csv" \
  -o "$d/data/stacks/nuxt-ui.csv" "$u/data/stacks/nuxt-ui.csv" \
  -o "$d/data/stacks/nuxtjs.csv" "$u/data/stacks/nuxtjs.csv" \
  -o "$d/data/stacks/react-native.csv" "$u/data/stacks/react-native.csv" \
  -o "$d/data/stacks/react.csv" "$u/data/stacks/react.csv" \
  -o "$d/data/stacks/shadcn.csv" "$u/data/stacks/shadcn.csv" \
  -o "$d/data/stacks/svelte.csv" "$u/data/stacks/svelte.csv" \
  -o "$d/data/stacks/swiftui.csv" "$u/data/stacks/swiftui.csv" \
  -o "$d/data/stacks/vue.csv" "$u/data/stacks/vue.csv" \
  -o "$d/data/styles.csv" "$u/data/styles.csv" \
  -o "$d/data/typography.csv" "$u/data/typography.csv" \
  -o "$d/data/ui-reasoning.csv" "$u/data/ui-reasoning.csv" \
  -o "$d/data/ux-guidelines.csv" "$u/data/ux-guidelines.csv" \
  -o "$d/data/web-interface.csv" "$u/data/web-interface.csv" \
  -o "$d/scripts/core.py" "$u/scripts/core.py" \
  -o "$d/scripts/design_system.py" "$u/scripts/design_system.py" \
  -o "$d/scripts/search.py" "$u/scripts/search.py" \
  -o "$d/LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Antigravity

Neste projeto: instala em .agents/skills/ui-ux-pro-max/.

d=".agents/skills/ui-ux-pro-max"
u="https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/skills/creative-design/ui-ux-pro-max"
curl -fsSL --create-dirs \
  -o "$d/SKILL.md" "$u/SKILL.md" \
  -o "$d/data/charts.csv" "$u/data/charts.csv" \
  -o "$d/data/colors.csv" "$u/data/colors.csv" \
  -o "$d/data/icons.csv" "$u/data/icons.csv" \
  -o "$d/data/landing.csv" "$u/data/landing.csv" \
  -o "$d/data/products.csv" "$u/data/products.csv" \
  -o "$d/data/prompts.csv" "$u/data/prompts.csv" \
  -o "$d/data/react-performance.csv" "$u/data/react-performance.csv" \
  -o "$d/data/stacks/flutter.csv" "$u/data/stacks/flutter.csv" \
  -o "$d/data/stacks/html-tailwind.csv" "$u/data/stacks/html-tailwind.csv" \
  -o "$d/data/stacks/nextjs.csv" "$u/data/stacks/nextjs.csv" \
  -o "$d/data/stacks/nuxt-ui.csv" "$u/data/stacks/nuxt-ui.csv" \
  -o "$d/data/stacks/nuxtjs.csv" "$u/data/stacks/nuxtjs.csv" \
  -o "$d/data/stacks/react-native.csv" "$u/data/stacks/react-native.csv" \
  -o "$d/data/stacks/react.csv" "$u/data/stacks/react.csv" \
  -o "$d/data/stacks/shadcn.csv" "$u/data/stacks/shadcn.csv" \
  -o "$d/data/stacks/svelte.csv" "$u/data/stacks/svelte.csv" \
  -o "$d/data/stacks/swiftui.csv" "$u/data/stacks/swiftui.csv" \
  -o "$d/data/stacks/vue.csv" "$u/data/stacks/vue.csv" \
  -o "$d/data/styles.csv" "$u/data/styles.csv" \
  -o "$d/data/typography.csv" "$u/data/typography.csv" \
  -o "$d/data/ui-reasoning.csv" "$u/data/ui-reasoning.csv" \
  -o "$d/data/ux-guidelines.csv" "$u/data/ux-guidelines.csv" \
  -o "$d/data/web-interface.csv" "$u/data/web-interface.csv" \
  -o "$d/scripts/core.py" "$u/scripts/core.py" \
  -o "$d/scripts/design_system.py" "$u/scripts/design_system.py" \
  -o "$d/scripts/search.py" "$u/scripts/search.py" \
  -o "$d/LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Global: instala em ~/.gemini/antigravity-cli/skills/ui-ux-pro-max/.

d="$HOME/.gemini/antigravity-cli/skills/ui-ux-pro-max"
u="https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/skills/creative-design/ui-ux-pro-max"
curl -fsSL --create-dirs \
  -o "$d/SKILL.md" "$u/SKILL.md" \
  -o "$d/data/charts.csv" "$u/data/charts.csv" \
  -o "$d/data/colors.csv" "$u/data/colors.csv" \
  -o "$d/data/icons.csv" "$u/data/icons.csv" \
  -o "$d/data/landing.csv" "$u/data/landing.csv" \
  -o "$d/data/products.csv" "$u/data/products.csv" \
  -o "$d/data/prompts.csv" "$u/data/prompts.csv" \
  -o "$d/data/react-performance.csv" "$u/data/react-performance.csv" \
  -o "$d/data/stacks/flutter.csv" "$u/data/stacks/flutter.csv" \
  -o "$d/data/stacks/html-tailwind.csv" "$u/data/stacks/html-tailwind.csv" \
  -o "$d/data/stacks/nextjs.csv" "$u/data/stacks/nextjs.csv" \
  -o "$d/data/stacks/nuxt-ui.csv" "$u/data/stacks/nuxt-ui.csv" \
  -o "$d/data/stacks/nuxtjs.csv" "$u/data/stacks/nuxtjs.csv" \
  -o "$d/data/stacks/react-native.csv" "$u/data/stacks/react-native.csv" \
  -o "$d/data/stacks/react.csv" "$u/data/stacks/react.csv" \
  -o "$d/data/stacks/shadcn.csv" "$u/data/stacks/shadcn.csv" \
  -o "$d/data/stacks/svelte.csv" "$u/data/stacks/svelte.csv" \
  -o "$d/data/stacks/swiftui.csv" "$u/data/stacks/swiftui.csv" \
  -o "$d/data/stacks/vue.csv" "$u/data/stacks/vue.csv" \
  -o "$d/data/styles.csv" "$u/data/styles.csv" \
  -o "$d/data/typography.csv" "$u/data/typography.csv" \
  -o "$d/data/ui-reasoning.csv" "$u/data/ui-reasoning.csv" \
  -o "$d/data/ux-guidelines.csv" "$u/data/ux-guidelines.csv" \
  -o "$d/data/web-interface.csv" "$u/data/web-interface.csv" \
  -o "$d/scripts/core.py" "$u/scripts/core.py" \
  -o "$d/scripts/design_system.py" "$u/scripts/design_system.py" \
  -o "$d/scripts/search.py" "$u/scripts/search.py" \
  -o "$d/LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Peça ao Rook

Já usa o Rook Labs? Cole no chat do Rook: instale a skill https://rooklabs.sh/marketplace/cct.ui-ux-pro-max

Prévia do SKILL.md

---
name: ui-ux-pro-max
description: "UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: websi…
---

# UI/UX Pro Max - Design Intelligence

Comprehensive design guide for web and mobile applications. Contains 50+ styles, 97 color palettes, 57 font pairings, 99 UX guidelines, and 25 chart types across 9 technology stacks. Searchable database with priority-based recommendations.

## When to Apply

Reference these guidelines when:
- Designing new UI components or pages
- Choosing color palettes and typography
- Reviewing code for UX issues
- Building landing pages or dashboards
- Implementing accessibility requirements

## Rule Categories by Priority

| Priority | Category | Impact | Domain |
|----------|----------|--------|--------|
| 1 | Accessibility | CRITICAL | `ux` |
| 2 | Touch & Interaction | CRITICAL | `ux` |
| 3 | Performance | HIGH | `ux` |
| 4 | Layout & Responsive | HIGH | `ux` |
| 5 | Typography & Color | MEDIUM | `typography`, `color` |
| 6 | Animation | MEDIUM | `ux` |
| 7 | Style Selection | MEDIUM | `style`, `product` |
| 8 | Charts & Data | LOW | `chart` |

## Quick Reference

### 1. Accessibility (CRITICAL)

- `color-contrast` - Minimum 4.5:1 ratio for normal text
- `focus-states` - Visible focus rings on interactive elements
- `alt-text` - Descriptive alt text for meaningful images
- `aria-labels` - aria-label for icon-only buttons
- `keyboard-nav` - Tab order matches visual order
…

Ver todo o marketplace