Agent Canvas

Canvas Excalidraw sterowany przez CLI do rysowania schematów blokowych, diagramów architektonicznych i makiet.

Autor: WHQ25 · WHQ25/agent-canvas

Testowano · Działa ★ 9.6/10

Agent Canvas — Canvas Excalidraw sterowany przez CLI do rysowania schematów blokowych, diagramów architektonicznych i makiet.

Co robi ten skill

Opakowuje pakiet npm @agent-canvas/cli, aby dodawać kształty, tekst, strzałki i obrazy do aktywnego canvasu Excalidraw przez WebSocket/HTTP, z samouczkami dla schematów blokowych, architektury, diagramów sekwencyjnych, map myśli i makiet interfejsu użytkownika. Wyzwalany, gdy użytkownik prosi o narysowanie, zwizualizowanie, narysowanie diagramu lub szkicu; wymaga zainstalowania oddzielnego CLI agent-canvas (bun/npm) i uruchomienia lokalnego serwera canvas.

Raport z testu

Uruchomiono rzeczywiste CLI: pominięcie formuły rozmiaru etykiety z SKILL.md spowodowało, że Excalidraw cicho zawinął 14-znakową etykietę na dwie linie i przerysował pole; użycie formuły wygenerowało dokładnie żądane pole w rozmiarze w=190 h=72 z czystą etykietą jednoliniową i strzałkami idealnie dopasowanymi do krawędzi, potwierdzone przez wyeksportowane pliki PNG.

Testowano: 2026-07-15 · Claude Code 2.x (agent harness)

Instalacja

git clone https://github.com/WHQ25/agent-canvas
mkdir -p ~/.claude/skills
cp -r agent-canvas/skills/agent-canvas ~/.claude/skills/agent-canvas

Komendy i przykładowe prompty

  • /agent-canvasCanvas Excalidraw sterowany przez CLI do rysowania schematów blokowych, diagramów architektonicznych i makiet.

Skille uruchamiają się na zwykłe polecenia — bez komend do zapamiętania. Po instalacji aktywują go prompty takie jak te (po angielsku):

  • Draw a flowchart with Start and Process Order boxes and an arrow
  • Sketch the architecture diagram for our microservices on a canvas
  • Create a sequence diagram showing the login request flow