Skill · em Criar imagem, vídeo e arte

draw-io

draw.io diagram creation, editing, and review. Use for .drawio XML editing, PNG conversion, layout adjustment, and AWS icon usage.

Procedência

Antes de instalar

6 arquivos · 47,3 KB · inclui 2 scripts que executam: scripts/convert-drawio-to-png.sh, scripts/find_aws_icon.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/draw-io/.

d=".claude/skills/draw-io"
u="https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/skills/creative-design/draw-io"
curl -fsSL --create-dirs \
  -o "$d/SKILL.md" "$u/SKILL.md" \
  -o "$d/README.md" "$u/README.md" \
  -o "$d/references/aws-icons.md" "$u/references/aws-icons.md" \
  -o "$d/references/layout-guidelines.md" "$u/references/layout-guidelines.md" \
  -o "$d/scripts/convert-drawio-to-png.sh" "$u/scripts/convert-drawio-to-png.sh" \
  -o "$d/scripts/find_aws_icon.py" "$u/scripts/find_aws_icon.py" \
  -o "$d/LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Global: instala em ~/.claude/skills/draw-io/.

d="$HOME/.claude/skills/draw-io"
u="https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/skills/creative-design/draw-io"
curl -fsSL --create-dirs \
  -o "$d/SKILL.md" "$u/SKILL.md" \
  -o "$d/README.md" "$u/README.md" \
  -o "$d/references/aws-icons.md" "$u/references/aws-icons.md" \
  -o "$d/references/layout-guidelines.md" "$u/references/layout-guidelines.md" \
  -o "$d/scripts/convert-drawio-to-png.sh" "$u/scripts/convert-drawio-to-png.sh" \
  -o "$d/scripts/find_aws_icon.py" "$u/scripts/find_aws_icon.py" \
  -o "$d/LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Codex

Neste projeto: instala em .agents/skills/draw-io/.

d=".agents/skills/draw-io"
u="https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/skills/creative-design/draw-io"
curl -fsSL --create-dirs \
  -o "$d/SKILL.md" "$u/SKILL.md" \
  -o "$d/README.md" "$u/README.md" \
  -o "$d/references/aws-icons.md" "$u/references/aws-icons.md" \
  -o "$d/references/layout-guidelines.md" "$u/references/layout-guidelines.md" \
  -o "$d/scripts/convert-drawio-to-png.sh" "$u/scripts/convert-drawio-to-png.sh" \
  -o "$d/scripts/find_aws_icon.py" "$u/scripts/find_aws_icon.py" \
  -o "$d/LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Global: instala em ~/.agents/skills/draw-io/.

d="$HOME/.agents/skills/draw-io"
u="https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/skills/creative-design/draw-io"
curl -fsSL --create-dirs \
  -o "$d/SKILL.md" "$u/SKILL.md" \
  -o "$d/README.md" "$u/README.md" \
  -o "$d/references/aws-icons.md" "$u/references/aws-icons.md" \
  -o "$d/references/layout-guidelines.md" "$u/references/layout-guidelines.md" \
  -o "$d/scripts/convert-drawio-to-png.sh" "$u/scripts/convert-drawio-to-png.sh" \
  -o "$d/scripts/find_aws_icon.py" "$u/scripts/find_aws_icon.py" \
  -o "$d/LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Antigravity

Neste projeto: instala em .agents/skills/draw-io/.

d=".agents/skills/draw-io"
u="https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/skills/creative-design/draw-io"
curl -fsSL --create-dirs \
  -o "$d/SKILL.md" "$u/SKILL.md" \
  -o "$d/README.md" "$u/README.md" \
  -o "$d/references/aws-icons.md" "$u/references/aws-icons.md" \
  -o "$d/references/layout-guidelines.md" "$u/references/layout-guidelines.md" \
  -o "$d/scripts/convert-drawio-to-png.sh" "$u/scripts/convert-drawio-to-png.sh" \
  -o "$d/scripts/find_aws_icon.py" "$u/scripts/find_aws_icon.py" \
  -o "$d/LICENSE" "https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/LICENSE"

Global: instala em ~/.gemini/antigravity-cli/skills/draw-io/.

d="$HOME/.gemini/antigravity-cli/skills/draw-io"
u="https://raw.githubusercontent.com/davila7/claude-code-templates/57f899e5394bb8ca166f38eacae8f0853cbfe033/cli-tool/components/skills/creative-design/draw-io"
curl -fsSL --create-dirs \
  -o "$d/SKILL.md" "$u/SKILL.md" \
  -o "$d/README.md" "$u/README.md" \
  -o "$d/references/aws-icons.md" "$u/references/aws-icons.md" \
  -o "$d/references/layout-guidelines.md" "$u/references/layout-guidelines.md" \
  -o "$d/scripts/convert-drawio-to-png.sh" "$u/scripts/convert-drawio-to-png.sh" \
  -o "$d/scripts/find_aws_icon.py" "$u/scripts/find_aws_icon.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.draw-io

Prévia do SKILL.md

---
name: draw-io
description: draw.io diagram creation, editing, and review. Use for .drawio XML editing, PNG conversion, layout adjustment, and AWS icon usage.
---

# draw.io Diagram Skill

## 1. Basic Rules

- Edit only `.drawio` files
- Do not directly edit `.drawio.png` files
- Use auto-generated `.drawio.png` by pre-commit hook in slides

## 2. Font Settings

For diagrams used in Quarto slides,
specify `defaultFontFamily` in mxGraphModel tag:

```xml
<mxGraphModel defaultFontFamily="Noto Sans JP" ...>
```

Also explicitly specify `fontFamily` in each text element's style attribute:

```xml
style="text;html=1;fontSize=27;fontFamily=Noto Sans JP;"
```

## 3. Conversion Commands

See conversion script at [scripts/convert-drawio-to-png.sh](scripts/convert-drawio-to-png.sh).

```sh
# Convert all .drawio files
mise exec -- pre-commit run --all-files

# Convert specific .drawio file
mise exec -- pre-commit run convert-drawio-to-png --files assets/my-diagram.drawio

# Run script directly (using skill's script)
…

Ver todo o marketplace