免费在 GitHub 公开中文介绍

diagram-maker

将概念、业务流程以及软件或云架构整理成图表文件。可保存为浏览器可打开的内嵌SVG的独立HTML文件，或便于后续编辑与协作的Excalidraw格式。

原文查看原文说明

Create SVG/HTML or Excalidraw diagrams for concepts, architecture, flows, and whiteboards.

适用场景

diagram-maker将概念、处理流程以及软件或云架构整理成图表文件。它会梳理元素、分组、简短标签和箭头所表示的关系，并选择从左到右、从上到下或泳道等布局。根据需要说明的内容，可制作概念图、架构图或手绘风格的图表。输出为内嵌SVG的独立HTML文件，或可编辑的Excalidraw文件。

适合在学习材料中解释概念、共享业务流程，以及梳理服务与数据库之间的关系。需要在浏览器中查看时，可选择SVG/HTML；需要后续编辑或用于协作时，可选择Excalidraw。图表会突出主要元素，避免内容过于密集。

SVG/HTML输出是独立文件，不使用外部字体、JavaScript、图片或远程资源。未指定路径时，保存为./diagram.html或./diagram.excalidraw，并在可行的情况下检查语法。

本介绍由 AI（OpenAI Codex）根据公开的 SKILL.md 撰写。准确的规格请查看下方原文。

AI 仅根据 SKILL.md 的内容，从 4 个方面进行了评估。星标数和热度不计入评估。

总分按每项 A=25 分、B=15 分、C=5 分相加。由 AI（OpenAI Codex）于 2026年10月19日评估。仅供参考，安装前请同时查看原文。

如果您认为评估有误，请申请复核

安装前可以查看交给 AI 代理的指令内容。

Create diagrams as artifacts, not prose. Choose one output mode:

clean-svg: educational concepts, physical systems, processes, lifecycle, simple data flow.
architecture-svg: software/cloud/infra topology, services, databases, queues, trust zones.
excalidraw: editable hand-drawn whiteboard, flowchart, sequence, architecture sketch.

Routing

User wants editable/collaborative: choose Excalidraw.
User wants polished standalone browser output: choose SVG/HTML.
Software architecture with infra components: choose architecture SVG.
Science, product, process, concept map, physical object: choose clean SVG.
Unsure: ask one short question only if output format matters; otherwise choose clean SVG.

Workflow

Extract nodes, groups, labels, and directed relationships.
Pick layout first: left-to-right, top-down, hub-spoke, swimlanes, layered stack, sequence.
Keep labels short. Prefer 5-9 main elements over dense diagrams.
Generate the file at the requested path, or ./diagram.html / ./diagram.excalidraw.
Verify syntax by opening/parsing when feasible.

SVG/HTML rules

Single standalone .html file with inline CSS and inline SVG.
No external fonts, JS, images, gradients, glows, decorative blobs, or remote assets.
Use semantic colors, not rainbow sequences: neutral, input, process, storage, external, risk.
Draw connectors before nodes so arrows sit behind boxes.
Every connector path has fill="none" and a marker arrow when directed.
Leave 24px text padding inside boxes; do not let text touch borders.
Legend only when symbols/colors are not obvious.

SVG template

Use references/svg-template.md as the wrapper and replace .

Excalidraw rules

Save .excalidraw JSON with type, version, source, elements, and appState.
Use bound text for shape labels. Do not use a nonstandard label property.
Keep bound text immediately after its container in the elements array.
Minimum labeled shape: 120x60. Minimum body text: 16px.
Use roughness 1, fontFamily: 1, and simple fills.

For exact Excalidraw element snippets, read references/excalidraw-patterns.md.

还没有评价。欢迎分享你的使用感受。

无需登录即可发表。欢迎分享使用感受、提问，或说明在哪些环境下无法运行。

还没有评论。来写第一条吧。