绘制各种风格的 SVG 信息图、架构图与流程图。 当用户提到以下任何场景时，务必使用此 skill： - 画流程图、架构图、系统图、信息图、示意图 - 用 SVG 绘制图表、可视化某个流程或概念 - "帮我画一张图说明……"、"生成一张架构图"、"画个示意图" - 将文字描述的系统或流程可视化为图表 - 想要特定风格的插图（Anthropic 风格、暗色主题等） 即使用户没有明确说"SVG"，只要涉及流程/架构/信息的可视化，都应使用此 skill。
绘图由图表类型和视觉风格两个维度独立决定，两两可自由组合。
图表类型决定布局结构（节点排列方式、箭头走向、层次关系）。
| 类型 | 适用场景 | 参考文档 |
|---|---|---|
| layered-flow | 垂直分层流程：Session 初始化 → 循环执行 → 结果；单条主线，强调阶段递进 | types/layered-flow.md |
| column-layer | 水平多列架构：N 个垂直列并排，每列代表一个系统层；列间有箭头流转；底部可有共享平面 | types/column-layer.md |
| swimlane | 泳道图：多个横向参与者各占一行，消息/箭头在泳道间流动；适合协议交互、多方协作 | types/swimlane.md |
| pattern-grid | 模式对比网格：多列并排展示不同模式/方案，每列独立纵向流程，底部有文字说明 | types/pattern-grid.md |
| side-by-side | 左右对比：两个方案/模式各占半幅，中间虚线分隔，适合"旧 vs 新"、"A 方案 vs B 方案" | types/side-by-side.md |
| nested-layer | 水平分层嵌套架构：3–4 个横向大层（如"应用层 → 生产层 → 数据层"），每层内部有子区块嵌套，左侧可附管控面板 | types/nested-layer.md |
选择逻辑：
layered-flowcolumn-layerswimlanepattern-grid 或 side-by-sideside-by-side；三个及以上 → pattern-gridnested-layer视觉风格决定颜色、字体、箭头样式等视觉语言，与类型正交，可任意搭配。
| 风格 | 描述 | 参考文档 |
|---|---|---|
| anthropic-flat | Anthropic/Claude 官方文档视觉语言；低饱和度色块，flat 无阴影，细边框 | styles/anthropic-flat.md |
默认风格：未指定时使用 anthropic-flat。
添加新类型：在
types/下新建.md，在上方类型表中登记。
添加新风格：在styles/下新建.md，在上方风格表中登记。