Packet diagram generator

Create a Packet diagram online for free. Rendered live with Mermaid syntax, exportable as PNG or SVG, no sign-up needed.

Open the online editor

Live preview

…

How the syntax works

Every Packet diagram starts with a keyword, and the lines below describe hierarchy and relationships through indentation and symbols. The canvas updates as you type.

packet
    title TCP header
    0-15: "Source port"
    16-31: "Destination port"
    32-63: "Sequence number"
    64-95: "Acknowledgment number"
    96-99: "Data offset"
    100-105: "Reserved"
    106-111: "Flags"
    112-127: "Window size"

Common uses

Widely used in technical documentation, product design, project management, and teaching. The result drops straight into Markdown, web pages, or slide decks.

Frequently asked questions

Do I need an account to make a Packet diagram?

No. Every feature is free and open, you can start the moment the page loads, and exports are unlimited.

What formats can a Packet diagram be exported to?

PNG and SVG. SVG is a vector format, so it stays sharp at any zoom level and works well in documents and slide decks.

How do I share a Packet diagram with someone?

The share button produces a link with the diagram code embedded directly in it. Whoever opens it sees the same diagram, with no login required.

Start drawing your Packet diagram now

18 diagram types, 10 languages, rendered live in your browser. No sign-up, free to use.

Open the online editor

Related diagram types