# Drawing Tools & Canvas

A comprehensive guide to every drawing tool, element property, and canvas control in whiteboard mode.

## Drawing Tools

Whiteboard mode provides 8 native drawing tools. Press the shortcut key to switch instantly. No need to reach for the toolbar.

### Select

`V`

Click to select a single element. Drag to move it. Draw a selection box to select multiple elements at once. Hold Shift and click to add to the current selection.

### Freehand Pen

`P`

Draw freely with your mouse or trackpad. Strokes follow your cursor exactly. Great for quick sketches, annotations, and hand-drawn emphasis. Line smoothing is applied automatically.

### Rectangle

`R`

Click and drag to draw a rectangle. Hold Shift to constrain to a perfect square. Rectangles support fill color, stroke, and rounded corners.

### Ellipse

`O`

Click and drag to draw an ellipse. Hold Shift to constrain to a perfect circle. Works well for callouts, badges, and grouping indicators.

### Arrow

`A`

Draw directional arrows between elements. Arrows can bind to shapes. When you move the shape, the arrow follows. Supports start/end arrowheads and labels.

### Line

`L`

Draw straight lines without arrowheads. Useful for dividers, underlines, and structural separators. Hold Shift for perfectly horizontal, vertical, or 45° lines.

### Text

`T`

Click anywhere to place a text block and start typing. Double-click existing text to edit. Supports font size, alignment, and can be bound inside shapes as labels.

### Eraser

`E`

Click or drag across elements to remove them from the canvas. The eraser deletes entire elements it touches. It does not partially erase strokes.

## Element Properties

After selecting an element, use the properties panel to customize its appearance. These settings apply to shapes, lines, arrows, and text.

### Stroke Color

The outline/border color of shapes and the color of lines, arrows, and text. Choose from a color picker or enter a hex value.

### Background Color

The fill color inside shapes. Set to transparent for outlined-only shapes, or choose a solid color for filled shapes.

### Fill Style

Controls how the background color is applied: Solid (flat fill), Hachure (diagonal hand-drawn lines), or Cross-Hatch (crosshatch pattern).

### Stroke Width

The thickness of outlines and lines. Thinner lines (1px) for subtle details, thicker lines (4px) for emphasis and primary elements.

### Roughness

Controls how hand-drawn elements appear. 0 = clean straight lines. 1 = slight wobble (default sketchy look). Higher values = more organic feel.

### Opacity

Element transparency from 0% (invisible) to 100% (fully opaque). Lower opacity is useful for background layers and watermark-style elements.

## Element Manipulation

Transform, organize, and layer elements on the canvas.

### Resize

Drag corner or edge handles on selected elements. Hold Shift to maintain aspect ratio while resizing.

### Rotate

Drag the rotation handle above a selected element. Hold Shift to snap to 15° increments.

### Group / Ungroup

Select multiple elements and group them (⌘/Ctrl+G) to move and transform as a unit. Ungroup with ⌘/Ctrl+Shift+G.

### Lock / Unlock

Lock elements to prevent accidental moves or edits. Locked elements cannot be selected by clicking. Use the context menu to unlock.

### Z-Ordering

Right-click an element to bring to front, send to back, or move forward/backward one layer. Controls overlap order.

## Canvas Navigation

### Pan

Scroll with your mouse wheel or trackpad to pan the canvas. On a trackpad, use two-finger scroll. You can also hold Space and drag to pan while any tool is active.

### Zoom

Use `⌘/Ctrl` + `+`/ `-` or pinch on a trackpad. The toolbar also has zoom in/out buttons with a percentage readout.

### Fit to View

Press `⌘/Ctrl` + `0` or click the Fit View toolbar button to zoom and center so all elements are visible. Essential after scrolling far from content.

### Grid Snapping

Toggle the grid from the toolbar. When enabled, elements snap to grid intersections when dragged or resized. Great for structured layouts. Disable for freehand work.

## Keyboard Shortcuts

Complete shortcut reference for whiteboard mode

Select tool

`V`

Freehand pen

`P`

Rectangle

`R`

Ellipse

`O`

Arrow

`A`

Line

`L`

Text

`T`

Eraser

`E`

Toggle flowchart / whiteboard

`Shift` +`W`

Open AI assistant

`⌘/Ctrl` +`K`

Start presentation

`⌘/Ctrl` +`P`

Exit presentation or deselect

`Escape`

Zoom in

`⌘/Ctrl` +`+`

Zoom out

`⌘/Ctrl` +`-`

Fit to view

`⌘/Ctrl` +`0`

Undo

`⌘/Ctrl` +`Z`

Redo

`⌘/Ctrl` +`Shift` +`Z`

Group selection

`⌘/Ctrl` +`G`

Ungroup

`⌘/Ctrl` +`Shift` +`G`

Copy selected

`⌘/Ctrl` +`C`

Paste

`⌘/Ctrl` +`V`

Duplicate

`⌘/Ctrl` +`D`

Remove selected elements

`Delete`

## Tips & Tricks

**Shift-constrain:** Hold `Shift` while drawing to lock aspect ratio (perfect squares, circles, horizontal/vertical/45° lines).

**Quick text in shapes:** Double-click any shape to add a bound text label inside it. The text stays centered as you resize the shape.

**Arrow binding:** Drag an arrow endpoint onto a shape to bind it. Now moving the shape automatically repositions the arrow. No manual reconnecting needed.

**Space + drag to pan:** Hold `Space` and drag to pan the canvas without switching tools. Release Space to return to the active tool.

[Whiteboard Overview](/content/help/whiteboard/index.html) [OpenCharts Library](/content/help/whiteboard-library/index.html)
