Toolbar

The toolbar appears at the top of the screen and is divided into two groups. The left group contains node operations, history, and other utilities; the right group contains panel toggle buttons.

The leftmost "Back to document list" button is always clickable. If already saved, it returns immediately. If unsaved or currently saving, a full-screen saving overlay appears and it automatically returns after saving completes.

Tool Selection Group

Switches the active working mode. The active tool is highlighted.

Button	Action
Select	Select, move, and resize nodes. Drag the background with nothing selected to pan the canvas.
Draw Text Box	Drag on the canvas to create a new text node. Text input mode starts immediately after creation.
Draw Rectangle	Drag on the canvas to create a new rectangle node.
Connection Tool	Draw a connection line between two nodes. Click the starting node, then click the ending node to confirm.

Tool Lock

Double-clicking the Text, Rect, or Connection tool locks it. While locked, the same tool remains active after creating a node, so you can create multiple nodes of the same type in succession. Double-click again or select another tool to unlock.

Action Group

Button	Action
Cut	Copies selected nodes to the clipboard and deletes them. Disabled when nothing is selected.
Copy	Copies selected nodes to the clipboard. Disabled when nothing is selected.
Paste	Pastes clipboard nodes at the mouse cursor position.
Delete	Deletes all selected nodes. The button is disabled when nothing is selected.
Auto Grouping	Toggles auto-grouping on/off. When on, overlapping nodes are automatically treated as a group.

History Group

Button	Action
Undo	Undoes the previous action. Disabled when there is nothing to undo.
Redo	Redoes the last undone action. Disabled when there is no undo history.

Utility Group

Button	Action
Corner Linking	Toggles corner linking on/off. When on, rect-like nodes that share a vertex within the snap threshold behave as if they share one corner. It remains active when smart snap is off.
Fit View	Automatically adjusts zoom and scroll position so all nodes fit in the viewport.
New Document	Clears the current document and starts a new one. A confirmation dialog appears before proceeding.
Export	Opens the export panel to save the canvas as SVG, PNG, or PDF. Click again to close.
Settings	Opens the settings panel to change the UI theme (light/dark) and display language. Click again to close.

Panel Group

The buttons at the right end of the toolbar switch between panels. The active button is highlighted, and dragging the left edge of a panel changes the shared width for all panels. The width is saved in document data, with a minimum of 300px and a maximum of 50% of the window width.

Button	Action
Properties	Shows properties (font, color, size, etc.) of the selected node. The panel is hidden when nothing is selected.
Layers	Displays all nodes in layer order. You can reorder layers and toggle visibility.
Document Settings	Configures canvas size, units, and orientation. Also lets you resize the canvas to fit the content.
Grid & Snap	Configures grid visibility and spacing, and snapping (snap-to-grid and snap-to-node).
Icon Library	Search GCP, Google, AWS, Cloudflare, Sakura Cloud, Twemoji, and React Icons and drag them onto the canvas.

Many actions are also available via keyboard shortcuts. See the Keyboard Shortcuts page for details.