UML
14px
☰
+ Node
+ Edge
+ Container
Rect
Circle
Diamond
Triangle
Cylinder
Table
User
Container
Header
UML
Flowchart
↩ Undo
↪ Redo
↓ Save
↓ SVG
↑ Load
👁
{ }
−
12
+
Diagrams
×
Paste Diagram JSON as Sub-diagram
Paste a diagram JSON object below. It will replace the sub-diagram of the selected node.
Items
×
JSON
{ }
×
−
100%
+
⊙
Fit
▶ Present
✎ Edit
Open Sub-chart
Remove Sub-chart
Edit Node
Add Port
Delete
Cancel (Esc)
Edit Edge
Flip Direction
Delete
Edit Node
Label
Shape
Rectangle
Circle / Oval
Diamond
Triangle
Cylinder
Table
User (stick figure)
Container
Header
Label placement
Inside the shape
Above the node
Below the node
Text padding
(px, blank = default)
Text align
Default
Left
Center
Right
Auto-fit to contents
Hugs the nodes inside it. Drag the resize handle to change which nodes it surrounds — it snaps back to fit when you let go.
Fit padding
(px, blank = 16)
Rows
+ Add Row
Color
(optional override)
Width
×
Height
Ports
+ Add Port
📋 Paste Sub-diagram
Cancel
Apply
Edit Edge
Label
Type
(arrows)
Directed (→)
Undirected (—)
Dependency (⇢)
Bidirectional (↔)
Inheritance (▷)
Label distance from end
(px, start/end only)
Label offset
On the line (default)
Above / left of the line
Below / right of the line
Label position
Start (near source)
Middle
End (near target)
Line style
Solid
Dashed
Dotted
Cancel
Apply
Confirm
Cancel
Delete