Plugin icon



Add support for bytefield-svg diagrams used to describe network protocols, memory layouts and any other binary structure.

Additional Information

Maintainers: marc0l92
Minimum app version:2.2
Downloads: This version:673
Last updated:2022-01-18T17:37:56Z

Joplin Plugin - bytefield-svg

This plugin allows you to create diagrams using the syntax defined in This type of diagram is usually used to describe network protocols, memory layouts, and other data structures.

This plugin don't need an internet connection to work.

Install the plugin

Automatic installation

Use the Joplin plugin manager to install it (Joplin > Options > Plugins). Search for bytefield-svg.

Manual installation

  • Download the last release from this repository.
  • Open Joplin > Options > Plugins > Install from File
  • Select the jpl file you downloaded.

Markdown syntax

Use the markdown fence syntax to create a new bytefield-svg diagram. Inside this block you can use the syntax documented at


Syntax example:

(draw-box "Address" {:span 4})
(draw-box "Size" {:span 2})
(draw-box 0 {:span 2})
(draw-gap "Payload")

Rendering example:

Rendering example

Other functionalities

Menu shortcuts

If you don't remember the syntax to create a bytefield-svg diagram you can use the templates in the tools menu.


If you want to contribute to this plugin you can find here some useful references: