用途：artifact-diagram 用于把模块、服务、请求路径、决策分支等关系画成图表。用户说“画架构”“映射这个包”“画数据流”“展示调用图”“把 schema ERD 化”时适用。若需要可点击流程用 artifact-flow，幻灯片式可视化用 artifact-deck。
主要能力：按固定输出契约，始终产出一个 .html 文件，内含内联 SVG 元素，不使用外部图片、Mermaid、PlantUML 或 ASCII 框。注解与图例是真实 HTML 元素（如 aside.note、div.legend）叠放在 SVG 上或旁侧，而非只放 <text> 内。提供三个模板：flowchart.html 为上下或左右排布的有向图，含决策菱形、动作矩形、开始结束椭圆；module-map.html 为带依赖箭头的包块群组，可聚焦某模块；svg-figure-sheet.html 为一页多个独立 SVG 图，每图带说明与图例。
使用方式：先阅读 artifact-css/SKILL.md 获取输出契约、设计 token 与类词汇。图表为静态，不使用 jQuery。SVG 约定：设置 viewBox，宽度 800-1200px；动作框 180×60、rx=8，决策菱形约 240×100，开始结束胶囊 120×40、rx=20，相邻节点间隔 80-100px；在 <defs> 定义 arrow 箭头 marker 并在每条边引用；描边 1.5px、颜色 var(--slate)。颜色语义用于表达含义而非装饰：paper 为中性，oat 为分支决策，gray-100 为被动或数据存储，clay 为焦点或热路径，olive 为成功完成，rust 为错误失败，sky 为异步或队列。标签可放节点内、边上或 SVG 外的 HTML 正文，长文字用编号标注配合下方列表。
限制与规则：一次图只回答一个问题，节点不超过 12-15 个，箭头原则单向。若页面打印，SVG 可无损缩放；禁用 JS 时仍可渲染。完成后可提供两个衍生物：图表纯文本大纲（节点与边列表），以及可复制的仅 SVG 片段。原文暂未提供收费、价格或平台信息。