/ 目錄 / 演練場 / excalidraw-skill
← 全部伺服器 ↗ GitHub
● 社群 Agents365-ai ⚡ 即開即用

excalidraw-skill

作者 Agents365-ai · Agents365-ai/excalidraw-skill

Claude Code 技能，可將自然語言描述的系統架構轉換為手繪風格的 Excalidraw 圖表，支援 SVG/PNG/可編輯 .excalidraw 匯出。

Agents365-ai 的 Excalidraw 技能能自動偵測討論內容是否需要圖表（3 個以上元件、多層系統、工作流程），並產生對應類型：流程圖、架構圖、時序圖、心智圖或泳道圖。可透過 Kroki API（免安裝）或搭配 Firefox 的本機 excalidraw-brute-export-cli 匯出。可編輯的 .excalidraw 檔案可直接在 excalidraw.com 開啟。

▶ 觀看演示 📦 安裝 💡 使用場景

為什麼要用

核心特性

即時演示

實際使用效果

excalidraw-skill.replay ▶ 就緒
0/0

安裝

作者儲存庫 · Claude Skills 官方文件

使用場景

實戰用法： excalidraw-skill

根據文字描述草繪微服務架構圖

👤 撰寫設計文件的工程師 ⏱ ~10 min beginner

何時使用： 你正在撰寫 RFC，想在不開啟其他工具的情況下插入架構圖。

步驟
  1. 描述系統
    Use the excalidraw skill — draw a microservices e-commerce architecture with clients, API gateway, 4 services, RabbitMQ, and per-service databases.✓ 已複製
    → Claude 產生版面配置並透過 Kroki 匯出 SVG
  2. 調整並重新匯出
    Add Redis in front of the product service and regenerate.✓ 已複製
    → 加入 Redis 後版面重新平衡的更新圖表
  3. 儲存可編輯版本
    Save as .excalidraw so I can edit it on excalidraw.com.✓ 已複製
    → 檔案儲存至目前工作目錄

結果： 在 5 分鐘內於文件中產生手繪風格的架構圖。

注意事項
  • 10 個以上元件時圖表過於雜亂 — 先請 Claude 依層級分組；此技能內建對應的版面配置規則
搭配使用： filesystem

根據剛除錯完的 API 互動產生時序圖

👤 為隊友記錄流程的後端工程師 ⏱ ~10 min beginner

何時使用： 你終於搞清楚 5 個服務的 OAuth 流程，想把它記錄下來。

步驟
  1. 貼上日誌或描述流程
    Excalidraw skill — sequence diagram: user → frontend → auth service → identity provider → callback → session.✓ 已複製
    → 產生含正確箭頭與回傳訊息的時序圖
  2. 細化
    Add the error path when the IdP returns 401.✓ 已複製
    → 以明顯不同的方式呈現替代流程

結果： 一張可直接附在 PR 說明中的時序圖。

組合

與其他 MCP 搭配，撬動十倍槓桿

excalidraw-skill + filesystem

將產生的圖表直接儲存至文件資料夾

Generate the architecture diagram and save it to docs/architecture/v2.svg.✓ 已複製
excalidraw-skill + github

將圖表與規格文件一起提交，附加到 PR 中

Create the diagram, commit to docs/, and reference it in the PR body.✓ 已複製

工具

此 MCP 暴露的能力

工具輸入參數何時呼叫成本
generate_flowchart process description 流程包含決策點與循序步驟時 0 via Kroki, 0 local
generate_architecture components + relationships 系統具有層級結構或服務邊界時 0
generate_sequence actors + messages 需要記錄具時間順序的互動流程時 0
export_png diagram ID 需要點陣圖格式以供不支援 SVG 的文件使用時 0 (requires local CLI)

成本與限制

運行它的成本

API 配額
Kroki 沒有明確的配額限制，但請勿頻繁大量請求
每次呼叫 Token 數
圖表規格相當精簡（通常少於 2k tokens）
費用
免費——技能為本機檔案，Kroki 亦為免費服務。
提示
一次性使用選 Kroki；只有在需要離線使用時才安裝 excalidraw-brute-export-cli。

安全

權限、密鑰、影響範圍

憑證儲存： 無需任何憑證——純粹以提示詞運作
資料出站： 使用 Kroki 路徑時，圖表規格會傳送至 kroki.io。使用本機 CLI 路徑時不會傳送任何資料。

故障排查

常見錯誤與修復

觸發關鍵字有誤——Claude 改用 Mermaid 輸出

請明確說出 'excalidraw'；單說「畫一張圖」可能會觸發其他工具。

替代方案

excalidraw-skill 對比其他方案

替代方案何時用它替代權衡
Mermaid via markdown你的文件平台已原生支援 Mermaid 渲染（如 GitHub 等）無手繪風格美學，版面配置控制較少
drawio via desktop app你偏好以手動點擊方式操作版面配置無法由 AI 代理驅動

更多

資源

📖 閱讀 GitHub 上的官方 README

🐙 查看未解決的 issue

🔍 瀏覽全部 400+ MCP 伺服器和 Skills