Excalidraw Diagrams & Libraries for Confluence — User Guide
Create beautiful hand-drawn style diagrams right inside Confluence pages using Excalidraw, with 220+ built-in icon libraries. Built on Atlassian Forge with zero data egress.
Quick Start
Step 1 — Insert a Diagram
While editing a Confluence page, type /excalidraw in the editor. Select Excalidraw from the dropdown to insert a new diagram macro.
Step 2 — Add Libraries (Optional)
Click the Add Libraries selector at the bottom of the editor to load icon libraries. You can select up to 3 libraries at a time. Drag and drop icons from the Library panel on the right onto your canvas.
Step 3 — Draw & Design
The Excalidraw editor opens in full screen. Use the toolbar to draw shapes, add text, insert images, and create connections.
Step 4 — Save
Click the Save button (top-right) to save your diagram. It will be embedded directly in the Confluence page.
Step 5 — View
After publishing the page, your diagram is rendered as a clean image preview.
Editor Interface
Toolbar
Tool | Description |
|---|---|
Lock / Hand | Lock elements or pan the canvas |
Selection | Select and move elements |
Rectangle / Diamond / Ellipse | Draw basic shapes |
Arrow / Line | Create connections and lines |
Pencil | Freehand drawing |
Text | Add text labels |
Image | Insert images |
Eraser | Remove elements |
Frame | Group elements in a frame |
Top-Right Actions
Button | Description |
|---|---|
Save | Save the diagram to the Confluence page |
Cancel | Discard changes and close the editor |
Library | Toggle the library panel on/off |
Bottom Bar
Control | Description |
|---|---|
Zoom (−/+) | Adjust zoom level |
Undo / Redo | Undo or redo actions |
Add Libraries | Open the library selector (up to 3) |
Hamburger Menu (☰)
Access additional options from the top-left menu:
Option | Description |
|---|---|
Reset the canvas | Clear all elements |
Export image | Export as PNG, SVG, or copy to clipboard |
Save to... | Save the scene file locally |
Dark mode | Toggle dark theme |
Canvas background | Change the canvas background color |
Features
Hand-Drawn Style Diagrams
All shapes and text are rendered in Excalidraw's signature hand-drawn style, giving your diagrams a clean, approachable look.
220+ Built-In Icon Libraries
Select from a rich collection of pre-loaded icon libraries. All libraries are bundled locally — no external network requests required.
Popular libraries include:
Category | Libraries |
|---|---|
Architecture | Software Architecture, System Design Components, Architecture Diagrams |
Cloud | AWS Architecture Icons, Cloud icons |
Development | GitHub Actions, Software Logos, Data Viz |
UX/Design | Basic UX/Wireframing, Forms, Awesome Icons |
General | Stick Figures, Decision Flow Control, Network Diagrams |
To use a library:
Click the Add Libraries selector at the bottom
Check up to 3 libraries from the dropdown
Icons appear in the Library panel on the right
Drag icons onto the canvas
Export Image
Export your diagram as PNG, SVG, or copy it to the clipboard.
Open the ☰ menu → Export image
Configure export options:
Option | Description |
|---|---|
Background | Include/exclude background |
Dark mode | Export in dark theme |
Embed scene | Embed the Excalidraw scene data in the image |
Scale | Choose 1×, 2×, or 3× resolution |
Click PNG, SVG, or Copy to clipboard
Zero Data Egress
Built on Atlassian Forge, all data stays within Atlassian's infrastructure. No data is sent to external servers.
Configuration & Options
Canvas Settings
Setting | How to Access | Options |
|---|---|---|
Background color | ☰ menu → Canvas background | White, Light gray, Light yellow, Light blue, etc. |
Dark mode | ☰ menu → Dark mode | On / Off (Shift+Option+D) |
Zoom level | Bottom-left controls | 10% – 300% |
Element Properties
Select any element to customize:
Stroke color — outline color
Fill color — background color
Stroke width — thin / bold / extra bold
Stroke style — solid / dashed / dotted
Fill style — hachure / cross-hatch / solid
Opacity — 0% to 100%
Font size — small / medium / large / extra large
Font family — Hand-drawn / Normal / Code
Library Selection
Maximum 3 libraries can be active simultaneously (for performance)
Selections persist during the editing session
Library icons appear in the right-side panel after selection
FAQ
How do I edit an existing diagram?
Click the diagram on the Confluence page while in edit mode to reopen the Excalidraw editor.
Can I use more than 3 libraries at once?
No. The limit of 3 simultaneous libraries is set for performance reasons. You can switch libraries at any time — simply deselect one and select another.
How do I export my diagram for use outside Confluence?
Use ☰ menu → Export image to export as PNG or SVG. Enable Embed scene if you want to reopen the exported image in Excalidraw later.
Is my data secure?
Yes. The plugin is built on Atlassian Forge with zero data egress. All diagram data is stored within Atlassian's cloud infrastructure and never leaves Atlassian's network.
Does the plugin work offline?
All 220+ icon libraries are bundled locally, so they work without external network access. However, the plugin requires a connection to your Confluence Cloud instance.
How do I reset the canvas?
Use ☰ menu → Reset the canvas to clear all elements and start fresh.