draw.io and the draw.io branded Atlassian integrations are the leading solution for web based sketching and diagramming functionality. The article describes the draw.io integration for Confluence that we, JGraph, build, deliver and maintain alongside the online version of our editor at app.diagrams.net, our draw.io desktop application.

Confluence Cloud is a popular tool for team productivity suitable for both small and large organisations. Atlassian provides customers with free instances, as long as the instance has ten users or fewer, and you can diagram in these instances with our draw.io Confluence Cloud integration.

Diagram freely

With the draw.io app installed in your free Confluence Cloud instance, you and your small team can draw a wide range of diagrams:

• flowcharts, business process diagrams, and gitflows
• mindmaps, org charts, and tree diagrams
• kanban boards
• mobile mockups and app layouts
• infographics and diagrams for presentations
• floor plans
• circuit layouts and rack diagrams
• UML diagrams and relational schema
• cloud infrastructure diagrams and threat models
• …
  

The draw.io diagram editor is easy to use and powerful. The draw.io app in Confluence Cloud is also secure and private - Your data stays in the browser while you are editing a diagram and is stored only in your Confluence Cloud instance when you use the draw.io app.

• Attach unlimited diagrams to pages with the draw.io macros.
• Use and connect shapes from an extensive collection of shape libraries.
• Style shapes, connectors and text labels.
• Draw freehand shapes and create custom shapes.
• Use a template from the template library to start diagramming quickly.
• Switch to various editor styles, including a simpler draw.io Board macro, ideal for brainstorming.
  

Install draw.io in a free Confluence Cloud instance

1. Set up a new Confluence Cloud instance, choosing the Free tier of up to 10 users on Atlassian’s Confluence Cloud pricing page.
2. Step through the installation and setup until you see the space landing page and Confluence Quickstart tutorial.
   

Install the draw.io app for Confluence Cloud

1. Click on the gear icon in the top right, next to your user initials to open the Confluence Cloud administration settings.
2. Under the Atlassian Marketplace section, click on Find new apps. Search for draw.io and click on it to see details about the draw.io app for Confluence Cloud.
   Alternatively, go to the draw.io app on the Atlassian Marketplace website.
   
3. Install the draw.io app in your Confluence Cloud instance. Note: If you have a team of users larger than 10, start a free trial - when the license expires, you’ll still be able to create all types of diagrams, but some advanced features are limited to the licensed version in larger Confluence Cloud instances.

draw.io as an online whiteboard

1. Edit a Confluence page, type /draw.io and insert the draw.io Board macro. The simple whiteboard-like editor will open.
2. Save your diagram and page so that your remote team members can collaborate on the draw.io Board drawing with you.

Learn more about using draw.io as an online whiteboard in Confluence

Learn the draw.io diagram editor

1. Edit a Confluence page, then type /draw.io and insert the draw.io Diagram macro. This will open the draw.io editor.
   
2. Select the Blank Diagram template, enter a filename for your diagram, and click Create.
   
3. Get to know the layout of the diagram editor: the shape and format panels, the toolbar, menus and drawing canvas. The default layout is the same as at app.diagrams.net.
   
4. Step through the tutorial to draw a basic flowchart in the draw.io editor.
   • add and connect shapes using the shape libraries on the left
   • add labels to the shapes and connectors on the drawing canvas
   • style your diagram using the tools in the format panel on the right.
     
5. Instead of exporting your diagram, click Publish to save your new diagram, or Save & Exit to save an existing diagram, then publish your Confluence page.

License draw.io for larger teams

The price of the draw.io app is very affordable in Confluence Cloud. See the tier-price comparison when migrating from Confluence Server to Confluence Cloud with draw.io.

If you have started a free trial in your team of more than 10 users and let the license expire, you will need to purchase draw.io to continue diagramming in your instance.

Licensing the draw.io app for your larger Confluence Cloud instance allows you to receive product support and use all of draw.io’s features, including those listed below.

• Import and export .vsdx files.
• Drag and drop diagram files into the editor.
• Add multiple pages to a diagram.
• Export to PDF files and print diagrams.
• Use math typesetting.
• Set up and use custom shape libraries.
• Customise the draw.io editor and set global corporate styles with JSON configuration options.
• Use the search feature to find shapes.
• Use the collaborative editing functionality to simultaneously edit a diagram with your teammates.
• Work with the diagram file’s revision history.
• Display an older version of the diagram when viewing a page.
• Import PlantUML or Mermaid code to automatically create a diagram.
• Import CSV data with formatting options to automatically create a diagram.
• Embed diagrams from cloud storage platforms (Google Drive and Microsoft OneDrive).
  

Small teams with up to 10 Confluence Cloud users can use all of the features of the draw.io app for free.

Follow us on GitHub, Twitter, Facebook.