Bytefield
Compatible with bytefield-svg
Byte-field / packet-layout diagrams. Designed for binary protocol specifications, file-format documentation, network packet structure, register maps. Tiny Clojure-flavoured DSL — `(draw-column-headers)`, `(draw-box "flags" [{:span 4}])` — renders the kind of figure you see in RFCs.
In the same space
Most users come to Bytefield from Hand-drawn RFC packet diagrams or TikZ bytefield. flowss runs this engine in the browser — no install, shareable via URL, exportable to PNG / SVG / PDF / source.
Syntax at a glance
(draw-column-headers)
(draw-box "Version" {:span 1})
(draw-box "Length" {:span 2})Paste this in the Studio code pane to see Bytefield render live. The full grammar is at the upstream-docs link above.
Sample templates
All 10 →Minimal starter — header / payload / gap. The canonical introduction to bytefield-svg's DSL.
Classic TCP header layout — 32-bit columns, source/dest ports, sequence and ack numbers, flags strip and window size.
RFC 791 — Version / IHL / DSCP, length, identification, flags + offset, TTL, protocol, checksum, addresses.
First 16 bytes of every ELF binary — the magic number, class, endianness, version, OS / ABI bytes that the linker reads first.
Stylised on-disk superblock layout — magic, block size, inode counts, generation, journal pointer.
IPv4 header expressed as 32-bit rows.
bytefield · ← Browse all engines · Quick-start guide