Architecture diagrams from a text DSL

DiagramTool’s Architecture tab reads a native diagram: architecture document and draws services, databases, queues, cloud components, and UML classes on a white canvas. You type; the layout updates. The board stays in the browser workspace unless you save a file.

Open DiagramTool

What the architecture mode actually draws

The parser is not a generic “boxes and arrows” sketch. Each top-level keyword maps to a node kind with a palette and badge:

Edges are either explicit A -> B lines or a connects: list inside a node. Labels use the A ->|reads| B form. Connector style is a top-level edges: keyword: curved (default), orthogonal, step, or straight. Layout direction is vertical (top to bottom) or horizontal (left to right).

A checkout platform in a few blocks

diagram: architecture
title: Checkout platform
direction: horizontal
edges: orthogonal

service CheckoutAPI {
  type: api
  tech: Node.js
  connects: OrdersDB, EventBus
}

database OrdersDB {
  type: postgresql
  data: orders, payments
}

queue EventBus {
  type: kafka
  topic: checkout.events
}

cloud Edge {
  provider: aws
  kind: cloudfront
  connects: CheckoutAPI
}

That is enough for a readable service map. Insurance claims platforms appear in some bundled templates because they are a useful multi-service example — the DSL is not limited to insurance. The same keywords describe any HTTP API, store, and bus.

Groups and C4 drill-down

Real systems have tiers. A group block draws a dashed, tinted rectangle around named members. Groups are auto-sized after layout, can be dragged as a unit, and do not require you to place every box by hand.

C4 is optional, not a separate product. Set level: context | container | component | code and parent: on children. The canvas pill bar filters which level is visible. Click a node that has children to drill in; a breadcrumb returns to the full graph. Nodes without level: stay visible as scaffolding.

Templates shipped with the app include AWS 3-tier, Kubernetes microservices, a GCP pipeline, C4 context, a hierarchical C4 example, ER, network topology, and UML class. Open Templates on the Architecture tab rather than starting from a blank file.

What this page is not claiming

Architecture boards are authored in the native DSL (or restored from portable JSON). File → Open will not turn a draw.io stencil soup into an architecture model — draw.io imports become flow boards. Mermaid C4 diagrams are rejected as unsupported. For sequence calls and Gantt dates, use the Sequence and Gantt tabs.