Network diagram maker
Map a network topology as text and render it instantly. Lay out routers, switches, firewalls, subnets and a DMZ with Mermaid subgraphs — then export. Everything stays on your device.
One step per line. Indent two spaces to branch beneath the line above.
Topology you can keep in version control
A network diagram drawn as text describes the topology — which devices exist, how they connect, and which subnet each sits in — without a heavyweight Visio file. Use distinct shapes so the roles read at a glance: a circle for the internet or a cloud, a parallelogram for a firewall, a diamond for a router, the subroutine shape for a switch, and a cylinder for a server. Wrap each subnet, VLAN or security zone in a subgraph and the layout stays legible as the network grows.
Because it is plain Mermaid, the diagram lives beside your infrastructure notes or runbook and updates with a one-line edit during review — no dragging icons around a canvas.
Logical and physical views
Use solid arrows for physical cabling and a dotted, labelled link (for example "AP -. wifi .-> Laptop") for wireless or logical connections, so one diagram can carry both. Label subgraphs with the CIDR range (such as "LAN 10.0.10.0/24") to double the diagram as lightweight documentation of your addressing plan.
For an internet-facing design, a DMZ subgraph between the firewall and your private subnet makes the trust boundary obvious — exactly what a security reviewer wants to see in a design doc.
Frequently asked questions
How do I make a network diagram from text?
Use a Mermaid flowchart: give each device a shape (a diamond "{Router}" for routers, "[[Switch]]" for switches, "[/Firewall/]" for firewalls), connect them with arrows, and group subnets with "subgraph … end". It renders live and exports to SVG or PNG.
How do I show different devices like routers, switches and firewalls?
Pick a distinct Mermaid shape per role: "((cloud))" for the internet, "[/name/]" for a firewall, "{name}" for a router, "[[name]]" for a switch and "[(name)]" for a server. The cheatsheet above lists each one.
Can I group devices into subnets or VLANs?
Yes — wrap them in "subgraph VLAN 10 … end" or "subgraph LAN 10.0.10.0/24 … end". Each subgraph becomes a labelled box, which is the clearest way to show subnets, VLANs or a DMZ.
How do I show a wireless or logical link?
Use a dotted link with a label, for example "AP -. wifi .-> Laptop", to distinguish wireless or logical connections from solid physical cabling.
Is my network diagram uploaded anywhere?
No. It renders entirely in your browser with Mermaid, so internal device names, IP ranges and topology never leave your device.