> ## Documentation Index
> Fetch the complete documentation index at: https://pavan-c90e8846.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Draw and Design on the Infinite Whiteboard

> Open the LiveCanvas whiteboard, use Excalidraw tools, navigate the infinite canvas, and let Convex auto-save your work.

The LiveCanvas whiteboard gives you an infinite canvas powered by Excalidraw. You can sketch diagrams, wireframes, or freehand notes, and every stroke is saved automatically to Convex so your work persists across sessions and team members.

## Open the Whiteboard

From your workspace dashboard, click **New File** and select **Whiteboard**. LiveCanvas creates a new file entry in Convex and opens the Excalidraw canvas immediately.

## Drawing Tools

Once inside, the Excalidraw toolbar is available at the bottom of the screen. Use it to:

* **Selection** tool: Move and resize existing shapes
* **Rectangle**, **Diamond**, **Ellipse**, **Arrow**, **Line** tools: Draw basic shapes and connectors
* **Free draw** tool: Sketch freehand with smooth strokes
* **Text** tool: Drop text notes anywhere on the canvas
* **Image** tool: Insert images directly onto the board

<Tip>
  Press `Space` and drag to pan around the board. Use `Ctrl + scroll` (or pinch on trackpad) to zoom in and out fluidly across the infinite canvas.
</Tip>

## Navigate the Infinite Canvas

The whiteboard has no fixed boundaries. Pan and zoom to explore large diagrams or zoom deep into details. Excalidraw automatically optimizes rendering so performance stays smooth even with thousands of elements.

## Save Whiteboard State

LiveCanvas auto-saves your whiteboard data to Convex every time you make a change. You do not need to press a save button. The `whiteboard` field in the `files` table stores the serialized Excalidraw state as a string.

```typescript theme={null}
// convex/schema.ts (excerpt)
files: defineTable({
  fileName: v.string(),
  teamId: v.string(),
  createdBy: v.string(),
  archieved: v.boolean(),
  document: v.string(),
  whiteboard: v.string(),
}).index("by_teamId", ["teamId"]),
```

Because Convex syncs in real time, other workspace members see your whiteboard updates instantly when they open the same file.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.