mcpField
D
drawio-architecture

drawio-architecture

github.com/full-stack-skillsDevelopment065 installsUpdated 4w ago
Repository

About drawio-architecture

drawio-architecture is a skill for creating architecture, deployment and component diagrams with Draw.io or diagrams.net. It covers diagram structure, templates, export formats and practices for collaboration and version management.

Key features

  1. 01Create architecture and deployment diagrams
  2. 02Use C4, UML and cloud shapes
  3. 03Organize diagrams with layers and containers
  4. 04Export as PNG, SVG or PDF
  5. 05Store and collaborate on diagram files

Use cases

  1. 01Illustrate a system architecture for review
  2. 02Prepare an export for project documentation
  3. 03Edit .drawio diagrams through a repository
  4. 04Organize a complex system across multiple diagrams

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/full-stack-skills/drawio-skills --skill drawio-architecture

After installing, type/drawio-architecturein Claude Code to confirm it loaded.

Bundled filesagents/openai.yamlLICENSE.txt

Details

From the project README

When to use this skill

Use this skill whenever the user wants to:

  • 用 Draw.io 画系统架构图、部署图、组件图
  • 产出可导出的矢量/PNG 图用于文档或评审
  • 协作编辑与版本管理（如 Confluence、Git 存 .drawio）

How to use this skill

  1. 工具：Draw.io 桌面版或 diagrams.net；支持 .drawio XML、导出 PNG/SVG/PDF。
  2. 内容：从模板或形状库选（C4、UML、云组件）；用泳道/容器表达层次。
  3. 协作：存到 Confluence、Google Drive 或仓库；约定命名与图例。

Best Practices

  • 一图一主题；用标题与图例说明符号含义。
  • 保持风格统一（颜色、字体、箭头）；复杂系统用多图分层。
  • 导出时选合适分辨率；文档中引用时注明“架构图”与更新日期。

Keywords

draw.io, architecture diagram, C4, deployment diagram, 架构图, 部署图, diagrams.net

Comments

Markdown supported