Mermaid packet diagram in Markdown to PDF

A binary layout is drawn as rows of bit ranges with the ruler across the top.

Bit-range rows for a binary layout with the bit ruler across the top: the TCP header, as in a networking textbook.

Open PDFOpen in editorMarkdown file

Markdown source

Markdown · 27 lines
# Packet diagrams

The header of a TCP segment, 20 bytes without options:

```mermaid
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-103: "Reserved"
104: "CWR"
105: "ECE"
106: "URG"
107: "ACK"
108: "PSH"
109: "RST"
110: "SYN"
111: "FIN"
112-127: "Window size"
128-143: "Checksum"
144-159: "Urgent pointer"
160-191: "Options and padding (if data offset > 5)"
192-255: "Data (variable length)"
```

Rendered pages

PDF · 1 page · 10 KB
  1. Packet diagrams, page 1 of 1

The sample documents describe invented organizations in several countries. All names and figures are illustrative.

Mermaid diagrams in Markdown to PDF: every sampleIn the Markdown reference