Insert a diagram

The everyday route. Four clicks from an empty page to a diagram anyone on your team can edit.


#How to

A rendered PlantUML sequence diagram on a page showing User, A and B exchanging DoWork, an internal call, createRequest, RequestCreated and Done, with download and full screen buttons at the top right
Once it is on the page, hovering over a diagram reveals download and full screen at the top, zoom at the bottom, and the AI chat button on the left.
Typing the slash command anywhere on the page brings up the Diagram macro ready to insert at the cursor.

Step

What you do

1

Edit the page and type /diagram, then pick Diagram (Capable).

2

Choose the editor or language you want.

3

Draw or write. The preview updates as you go.

4

Close the editor. The diagram saves with the page.

Step-by-step versions for the two most common languages: Insert a Mermaid diagram in Confluence and Insert a PlantUML diagram in Confluence.

If you already know what you want, a Mermaid sequence diagram, your team's architecture template, a PlantUML class diagram, you can jump straight to it without editing the page first.

  1. In the byline under the page title, select Capable.

  2. Type what you are looking for in Search capabilities, for example mermaid, sequence or the name of one of your templates.

  3. Pick a result. Diagram libraries start a new diagram in that language from its starter diagram. Templates lists your space and global templates first, then the built-in ones.

  4. The editor opens with that diagram, ready to insert. Change what you need and select Insert.

#Naming it

Give the diagram a title. It shows in search results, in the diagram library, and in the alt text used by exports, so a title like "Untitled" costs you later.

A published page section headed User Journey with a Capable diagram below it, the diagram named User Journey in its header bar, showing a Mermaid journey chart with five stages and an emotional journe
Whatever you type in the title field is what readers see in the header bar above the drawing.

#A few things that catch people out

  • If /diagram does not appear, the app may not be installed for the space. See Troubleshooting.

  • A diagram inherits its display settings from the space, so it may look different from the editor preview.

  • Inserting from the byline cannot reach a page with view or edit restrictions that the app is not allowed through. You get Cannot insert diagram on restricted page; insert it from the page editor with /diagram instead.



Four clicks, and it is on the page.