도구

Turns natural-language descriptions, Mermaid or a real code repo into interactive single-file HTML diagrams: architecture, flowcharts, sequence diagrams, data flows and state machines. Validates output automatically and exports PNG or SVG.

Generates self-contained HTML+SVG diagrams in an editorial style: architecture, flowcharts, sequence, swimlane, Gantt and dozens more types. Can match brand colors from a website and redraw imported Mermaid, draw.io and Excalidraw sources.

Claude Code plugin for Next AI Draw.io that starts its Draw.io MCP server via npx. Generate and edit flowcharts, architecture and sequence diagrams in plain language, with live browser preview, version history and .drawio export. Needs Node.js.

Lets agents create and edit draw.io diagrams such as flowcharts and architecture diagrams in plain language, with live browser preview, version history and export to .drawio, PNG or SVG. Includes an embedded server; runs locally with no API key.

Declarative diagram scripting language: describe architecture diagrams, flowcharts and sequence diagrams in concise text with automatic layout, then render with the d2 command to SVG, PNG, PDF or PPTX. Lets agents produce diagrams you can version-control.

Official Lark (Feishu) skill to view, export and edit whiteboards in Lark docs: write Mermaid, PlantUML or SVG into a board for flowcharts or org charts, or export boards as images or SVG. New boards are created with lark-doc. Needs lark-cli, Node.js and auth; install with lark-shared.

Turns terminal output like architecture explanations, diff reviews and plan comparisons into styled HTML pages or slides with zoomable interactive Mermaid diagrams, replacing hard-to-read ASCII diagrams and tables. No build step; open directly in a browser.

Turns architecture explanations, diff reviews, plan reviews and data comparisons into self-contained HTML pages or slides with Mermaid diagrams and light and dark themes, replacing ASCII diagrams in the terminal.

Generates editable draw.io architecture diagrams, ER diagrams, UML and BPMN flows from natural language or from Terraform, SQL DDL, OpenAPI specs and code repos, with incremental sync and multi-format export. Native export needs the draw.io desktop app.

Explains the current topic visually with the smallest view that makes the point: pseudocode, call trees, component or file trees, Mermaid diagrams or diffs, and a focused HTML diagram or short deck when the idea is too dense. Invoked manually.

Generates hand-drawn-style Excalidraw diagrams (.excalidraw files you can keep editing on excalidraw.com) from text, choosing fan-out, timeline or convergence layouts by how concepts relate. Optional uv and Playwright let the agent render and check layouts; colors live in one file you can restyle.

Gives agents a live local Excalidraw canvas: add, edit and delete elements to draw architecture diagrams and flowcharts, take screenshots to check the result, convert Mermaid and export .excalidraw files. Runs locally with no API key; also ships a CLI and an agent skill.

Figma's official skill: the agent writes Mermaid, then uses the Figma MCP to build flowcharts and sequence, state, Gantt and ER diagrams in FigJam for you to tweak by hand. Unsupported types like pie charts and mind maps are flagged upfront. Needs a Figma account and the remote MCP server.

Figma's official skill for building FigJam boards through the Figma MCP: sticky notes, sections, connectors, shapes and tables for brainstorms, retros and meetings. Needs a Figma account, the remote MCP server and the figma-use skill; canvas writes are free in beta; usage pricing is planned.

Explains a codebase, feature, command or pull request to someone new to it as a PR Lens canvas: one plain sentence first, then a walkthrough that grows the diagram from two boxes to the whole picture, delivered as a shareable link. Requires the PR Lens skill and its npx CLI.

Draws a code change or part of a codebase as an animated architecture or data-flow diagram. The agent writes a JSON graph, validates and renders it to SVG with the PR Lens CLI, then pushes it to a prlens.dev canvas or attaches it to a GitHub, GitLab or Bitbucket pull request.

Google's official Gemini CLI extension with a built-in MCP server: Nano Banana image generation and editing, photo restoration, icons, textures, step-by-step storyboards and diagrams. Needs Node.js and a Gemini API key; for Claude Code or Codex, clone and build the repo first.

Generates flowcharts, sequence diagrams, class diagrams and other charts from Mermaid syntax with configurable theme and background, exporting SVG or PNG files or a mermaid.ink share link. Validates syntax so the model can fix errors over several turns.

Miro's official plugin with the Miro remote MCP and three skills: draw codebase explanations on a board, run visual code reviews on the board, and turn board docs, diagrams and prototypes into development specs. Needs OAuth with a Miro account.

Lucid's official hosted MCP: search and summarize documents in your Lucid account, generate flowcharts, org charts (importable from CSV) and sequence diagrams from a sentence, edit shapes, export PNGs and create share links. Needs a Lucid account (free plan works) with OAuth on first connect.