How do I change arrow paths?

Use the Straight or Elbow leader setting for a selected label. The L shortcut switches the selected leader type.

Does it keep vectors?

Export SVG keeps vector labels and arrows; the background image is embedded or linked according to the SVG setting.

Diagram Labeler

Add labels and arrows to an image.

Background

Auto label size

Advanced ▸ Tiny images

Allow extra-small size for <900px images (down to 0.2×)

Export area Margin

SVG: Embed image

Drop an image here to start — or tap anywhere to pick one

Editing help and keyboard shortcuts

Drag to move labels, pins and notes. Labels and pins have arrows; notes are plain text. Tips: drag empty background to pan; mouse wheel to zoom. Double-click a label or press Enter/E to edit (desktop). On mobile, use the Selected panel’s “Label text”. Selected label shortcuts: Delete, Ctrl/Cmd-D duplicate, L straight/elbow, A arrowhead cycle. Drag the small square on a label’s right edge to resize its text width.

Example output

Diagram labeling example with callouts and arrows. — Example output — results vary with input.

Help & FAQ — Diagram Labeler

How to use

Upload the diagram or screenshot you want to annotate.
Add labels, pins, or notes; drag arrows and adjust styles.
Export as PNG or SVG with your annotations preserved.

Use cases

Annotate diagrams for documentation.
Label screenshots for a presentation.

Tips & FAQs

How do I change arrow paths?: Use the Straight or Elbow leader setting for a selected label. The L shortcut switches the selected leader type.
Does it keep vectors?: Export SVG keeps vector labels and arrows; the background image is embedded or linked according to the SVG setting.

Formats & limits

Input: PNG, JPG, SVG backgrounds
Output: PNG or SVG
Browser memory limits apply for very large canvases

Privacy

Processing runs in your browser. Download saves a local copy; Share sends the result through your chosen app when supported.

Related tools

Updated

15 October 2025