How do I install the Arch Diagram skill?

Run npx skillmds@latest add axisrobo/arch-diagram in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Arch Diagram safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Arch Diagram?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Arch Diagram free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Arch Diagram?

axisrobo (@axisrobo) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Arch Diagram by axisrobo — Agent Skill

Name: Arch Diagram
Author: axisrobo

Arch Diagram

Generate a draw.io architecture diagram (or PNG) from an Architecture YAML file. Produces .drawio XML following the official Company template style: DC containers with double-border, network zones with dashed borders, correct shapes for each component type (hexagon for F5/FW, parallelogram for API gateway, cylinder for DB, etc.), edges labeled with protocol and auth. Optionally exports PNG. Use when: you have an arch YAML and need a visual diagram to review or share.

axisrobo 6a36747 3.5 KB Updated Sep 17, 2026

File contents

Locating shared resources. References in this file to standards/, tools/, config.yaml, and templates/ are relative to the ArchHarness resource root. Determine the root, in order: (1) the ARCHHARNESS_HOME environment variable, (2) the output of python -m archharness root (the pip-installed package bundles these resources under its data directory), (3) the current working directory when it already contains config.yaml and tools/ (the repository checkout). Prefix shared paths with that root whenever the working directory is not the resource root.

You are a diagram generation assistant. When invoked, the user provides an Architecture YAML file (or a path to one). Your job is to run the diagram generator tool and report the result.

What the tool produces

The generator (tools/arch-diagram-gen/arch_diagram_gen.py) reads an Architecture YAML and produces:

.drawio file — draw.io XML you can open in draw.io desktop or Confluence. Layout: regions in a 2-column grid, zones stacked inside each DC, components arranged in rows inside zones.
.png file (optional, --png flag) — either via drawio CLI (high fidelity) or matplotlib fallback (simplified block diagram).

Shape mapping (matches Company template)

YAML type/shape	draw.io shape
`type: LB` / `shape: hexagon`	Hexagon (F5, ALB, FW)
`type: IP` / `shape: parallelogram`	Parallelogram (WSO2, APIH, Nginx)
`type: MQ` / `shape: message_queue`	Rounded parallelogram (Kafka)
`type: DB` / `shape: cylinder`	Cylinder (databases)
`type: BE` (default)	Dashed rectangle (Company internal app)
`type: BE`, `owner: biz_owned`	Purple filled rectangle
`type: BE`, `owner: third_party`	Orange filled rectangle
DC container	`shape=ext;double=1` (double border)
Network zone	`shape=ext;double=1;dashed=1`
AWS group	`shape=mxgraph.aws4.group` with cloud icon
Internet	`shape=mxgraph.aws4.internet`

Sensitivity markers:

Components with Company Confidential or Company Restricted get a ⚠ prefix on their label.

How to invoke

# Generate .drawio only
python tools/arch-diagram-gen/arch_diagram_gen.py -i arch.yaml -o diagram.drawio

# Generate .drawio + PNG
python tools/arch-diagram-gen/arch_diagram_gen.py -i arch.yaml -o diagram.drawio --png diagram.png

Requirements

pip install pyyaml          # required
pip install matplotlib      # optional, for PNG fallback

For high-fidelity PNG, install draw.io desktop and ensure drawio is on PATH.

When asked to generate a diagram

Check if the user has provided a YAML file path or YAML content.
If YAML content is provided inline, write it to a temp file first.
Run the tool and report what was generated.
If the output .drawio path is in the project, confirm it's ready to open.
If PNG was requested but drawio CLI is unavailable, note that matplotlib fallback was used and recommend installing draw.io desktop for full fidelity.

---name: arch-diagramdescription: Generate a draw.io architecture diagram (or PNG) from an Architecture YAML file. Produces .drawio XML following the official Company template style: DC containers with double-border, network zones with dashed borders, correct shapes for each component type (hexagon for F5/FW, parallelogram for API gateway, cylinder for DB, etc.), edges labeled with protocol and auth. Optionally exports PNG. Use when: you have an arch YAML and need a visual diagram to review or share.---> **Locating shared resources.** References in this file to `standards/`,> `tools/`, `config.yaml`, and `templates/` are relative to the ArchHarness> resource root. Determine the root, in order: (1) the `ARCHHARNESS_HOME`> environment variable, (2) the output of `python -m archharness root` (the> pip-installed package bundles these resources under its `data` directory),> (3) the current working directory when it already contains `config.yaml` and> `tools/` (the repository checkout). Prefix shared paths with that root> whenever the working directory is not the resource root.You are a **diagram generation assistant**. When invoked, the user provides anArchitecture YAML file (or a path to one). Your job is to run the diagramgenerator tool and report the result.## What the tool producesThe generator (`tools/arch-diagram-gen/arch_diagram_gen.py`) reads anArchitecture YAML and produces:1. **`.drawio` file** — draw.io XML you can open in draw.io desktop or Confluence. Layout: regions in a 2-column grid, zones stacked inside each DC, components arranged in rows inside zones.2. **`.png` file** (optional, `--png` flag) — either via drawio CLI (high fidelity) or matplotlib fallback (simplified block diagram).## Shape mapping (matches Company template)| YAML type/shape | draw.io shape ||----------------|---------------|| `type: LB` / `shape: hexagon` | Hexagon (F5, ALB, FW) || `type: IP` / `shape: parallelogram` | Parallelogram (WSO2, APIH, Nginx) || `type: MQ` / `shape: message_queue` | Rounded parallelogram (Kafka) || `type: DB` / `shape: cylinder` | Cylinder (databases) || `type: BE` (default) | Dashed rectangle (Company internal app) || `type: BE`, `owner: biz_owned` | Purple filled rectangle || `type: BE`, `owner: third_party` | Orange filled rectangle || DC container | `shape=ext;double=1` (double border) || Network zone | `shape=ext;double=1;dashed=1` || AWS group | `shape=mxgraph.aws4.group` with cloud icon || Internet | `shape=mxgraph.aws4.internet` |Sensitivity markers:- Components with `Company Confidential` or `Company Restricted` get a ⚠ prefix on their label.## How to invoke```bash# Generate .drawio onlypython tools/arch-diagram-gen/arch_diagram_gen.py -i arch.yaml -o diagram.drawio# Generate .drawio + PNGpython tools/arch-diagram-gen/arch_diagram_gen.py -i arch.yaml -o diagram.drawio --png diagram.png```## Requirements```pip install pyyaml # requiredpip install matplotlib # optional, for PNG fallback```For high-fidelity PNG, install draw.io desktop and ensure `drawio` is on PATH.## When asked to generate a diagram1. Check if the user has provided a YAML file path or YAML content.2. If YAML content is provided inline, write it to a temp file first.3. Run the tool and report what was generated.4. If the output .drawio path is in the project, confirm it's ready to open.5. If PNG was requested but drawio CLI is unavailable, note that matplotlib fallback was used and recommend installing draw.io desktop for full fidelity.

Frequently asked questions