> ## Documentation Index
> Fetch the complete documentation index at: https://docs.imagine.art/llms.txt
> Use this file to discover all available pages before exploring further.

# Canvas Navigation

Learn how to navigate, add, and manage nodes on the canvas, connect handles, and use the toolbar and sidebar features.

## Adding and Managing Nodes

**Add a new node:**

* Click on `"+"` or `"Toolbox"` from the left toolbar

<Frame>
  ![Toolbox button in left toolbar](https://3206824585-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FflkeYZ5KwlfB1arDC2M2%2Fuploads%2FIegRw8RS1l7O2QLMmbzJ%2FScreenshot%202025-11-17%20at%203.17.14%E2%80%AFPM.png?alt=media\&token=0c14442a-8f7e-4c54-aa75-4a6da05fd060)
</Frame>

* Right-click anywhere on the canvas (or press `Space`)
* Search or browse by category

<Frame>
  ![Node search and category browser](https://3206824585-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FflkeYZ5KwlfB1arDC2M2%2Fuploads%2F9MQLeqdUWu5Qknwe5YSS%2FScreenshot%202025-11-17%20at%203.12.55%E2%80%AFPM.png?alt=media\&token=b09494f0-d5bc-4c05-9b19-a2b1b9896ef8)
</Frame>

* Click to add the node

**Move a node:**

* Click and drag it to the desired location

**Remove a node:**

* Select it (Highlighted) and Press `Delete` or `Backspace`

**Duplicate a node:**

* Select it and Press `Ctrl/Cmd + D`

## Connect and Manage Handles

**Connect a Handle:**

* Click and drag from an output slot (right side of a node) and connect to a compatible input slot (left side of another node)
* Release to connect the handle

<Frame>
  ![Connecting handles between nodes](https://3206824585-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FflkeYZ5KwlfB1arDC2M2%2Fuploads%2FVKgmlgJd9e7HNpZ7f5hK%2FScreenRecording2025-11-17at3.25.16PM-ezgif.com-video-to-gif-converter.gif?alt=media\&token=79134c75-2578-4353-b53f-f3f30ba173b8)
</Frame>

**Remove a Handle:**

* On hovering the handle, a `"x"` button appears to remove/delete it
* Click to select it (Highlighted) and Press `Delete` or `Backspace`

## Cut Connections with Scissors

The **Scissors** tool lets you sever node connections by drawing a cut line across them — useful for quickly cleaning up complex graphs without having to click each handle individually.

**To use the Scissors tool:**

<Steps>
  <Step title="Activate the Scissors tool">
    Hold `Alt` (Windows) or `Option` (Mac) and click-drag across the canvas, or select the Scissors tool from the left toolbar.

    <Frame>
      <img src="https://mintlify.s3.us-west-1.amazonaws.com/imagineart/images/placeholder-scissors-toolbar.png" alt="Scissors tool in toolbar — placeholder" />
    </Frame>
  </Step>

  <Step title="Draw across connections">
    Drag the cut line across any connections you want to remove. Every handle the line crosses will be severed.

    <Frame>
      <img src="https://mintlify.s3.us-west-1.amazonaws.com/imagineart/images/placeholder-scissors-cut.png" alt="Scissors cut line severing connections — placeholder" />
    </Frame>
  </Step>
</Steps>

<Tip>
  Use the Scissors tool when reorganizing a large workflow — it's much faster than deleting handles one by one.
</Tip>

## Canvas Navigation

**Pan the canvas:**

* Click and drag on empty space
* Use the **middle mouse button** or **two-finger drag** on a trackpad

**Zoom:**

* Use the **scroll wheel** (up/down) or the **pinch gesture** on a trackpad
* Use zoom controls in the bottom-right corner

## Left Toolbar

| Button            | Function                                                                                                                                   |
| ----------------- | ------------------------------------------------------------------------------------------------------------------------------------------ |
| **Core Nodes**    | Essential nodes for content generation such as Image, Video, Text, and Prompt Node                                                         |
| **Utility Nodes** | All other functional or helping nodes to assist you in editing or refining part, such as Upscale, Reframe, Crop, Extract Frame, Import etc |
| **Search**        | Find any node instantly with `Cmd + K`                                                                                                     |
| **Assets**        | Access to all previous generations                                                                                                         |
| **Move/Pan**      | Navigate and move within the canvas                                                                                                        |
| **Sections**      | Organizational iterations for structuring and grouping canvas nodes                                                                        |
| **Collaboration** | Intuitive collaboration tools featuring shapes, sticky notes, and share the project link with your team                                    |

<Frame>
  ![Left toolbar overview](https://3206824585-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FflkeYZ5KwlfB1arDC2M2%2Fuploads%2Fa3mXlrtwQWuEAqlAU1wI%2FScreenRecording2025-11-17at3.32.13PM-ezgif.com-video-to-gif-converter.gif?alt=media\&token=0ebb3444-2fd9-43de-8cc8-702d9477ba3a)
</Frame>

## Right Sidebar

**Nodes Properties and Model Settings:**

When you select a node or multiple nodes, the right panel displays settings specific to your selection and the chosen model.

<Frame>
  ![Right sidebar node properties and settings](https://3206824585-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FflkeYZ5KwlfB1arDC2M2%2Fuploads%2FoKKmsCS9GS5UZxVCUSw4%2FScreenRecording2025-11-17at3.35.08PM-ezgif.com-video-to-gif-converter.gif?alt=media\&token=12ca2261-8697-465e-97a5-8a173c27a0e4)
</Frame>

| Feature                                | Description                                                                                                                                     |
| -------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------- |
| **Node Properties and Model Settings** | When a node or multiple nodes are selected, the right panel shows specific settings and the model configurations                                |
| **Model Selection**                    | Choose from available models; settings and parameters (such as aspect ratios, resolution, etc.) will dynamically adjust based on your selection |
| **Number of Runs**                     | Specify how many times the selected node(s) should execute                                                                                      |
| **Run Selected Nodes**                 | Execute the selected node(s) with your configured settings                                                                                      |
