# The Canvas

The canvas is the heart of Maestri — an infinite 2D space where you arrange your terminals, notes, file trees, and other nodes however feels natural to you. There's no right or wrong layout; the canvas adjusts to your thinking, not the other way around.

## Inserting nodes

Select a tool from the top toolbar, then **click and drag** on the canvas to draw a rectangle. The node appears at the size and position you drew.

Available node types: **Terminal**, **Note**, **Text**, **Drawing**, and **File Tree**.

## Moving and resizing

- **Move** — Click and drag from an empty area inside the node (usually the header area at the top).
- **Resize** — Position the cursor on a corner or edge and drag to the desired size.

## Node actions

- **Duplicate** — Hold `` while dragging, or right-click → Duplicate  
- **Delete** — `` `W`, or right-click → Delete  
- **Focus in viewport** — ```\` while the node is selected

## Canvas navigation

Maestri's canvas navigation follows the conventions of design tools like Figma, so it should feel immediately familiar.

### Trackpad

- **Pan** — Two-finger swipe in any direction  
- **Zoom** — Pinch in or out

### Mouse

- **Pan** — Click and hold the scroll wheel, then drag  
- **Pan + zoom simultaneously** — Hold scroll wheel and scroll  
- **Zoom** — Hold `` and scroll  
- **Pan (alternative)** — Hold `Space` and click-drag

### Keyboard

- **Zoom in / out** — `` `+` / ```-`

## Zoom controls and mini map

Zoom controls are available in the **bottom-right corner** of the app. Next to them is a **mini map** that shows your current position on the canvas — useful when your workspace has grown large and you've lost track of where things are.

## Magnetic tile snapping

Hold `` while dragging a node and it snaps into mosaic-style layouts, automatically matching walls and filling gaps for a clean, tiled workspace.

- **Wall matching** — Nodes align to the nearest edge of adjacent nodes.  
- **Gap filling** — Drag a node into an empty space between others and it positions itself to fill the gap cleanly.  
- **Grid-free** — Snapping adapts to your actual layout instead of locking you into fixed sizes.

Release `` at any time to return to free-form dragging.

**Tip**  
When a node is selected, a dashed border appears around it to indicate the active selection. Click an empty area of the canvas to deselect.