Free · Map code objects and links

Class Diagram Maker

Show classes, their fields and actions, and how they connect in a software system.

  • Live preview
  • Private in your browser
  • SVG and PNG downloads

Map code objects and links

Edit the words on the left. The finished diagram appears on the right.

Look
Diagram code19 lines · 18 steps

Tip: press Ctrl or Command + Enter to draw now.

PreviewDrawing starter diagram
Drawing your diagram

Three simple steps

How to use it

  1. Create one class block for each main object in the system.
  2. List only the fields and actions that help explain the design.
  3. Add arrows last so the links stay easy to follow.

Your diagram stays on this device

Mermaid draws the diagram inside this browser tab. Bookify does not upload or save your code or diagram. Close the tab and the working copy is gone.