Export a diagram to HTML
You can embed a diagram in a web page or in any online platform that can render HTML. While some third-party integrations can embed diagrams more efficiently (in WordPress, for example), embedding a diagram as HTML may be a good option. You can also share these HTML diagram files with others.
Note: Diagrams exported to HTML files/code are rendered in the draw.io viewer by calling a JavaScript hosted on the draw.io server. You’ll need a working internet connection for the diagrams to be displayed properly.
How to export a diagram as HTML
- Click File > Export as > HTML.
- Change the export settings to suit your requirements, then click Export.
- You can include the Public URL of the diagram instead of making a copy of the diagram in the HTML if you are using Google Drive to store your diagram. If your diagram is stored elsewhere, this radio button will not be selectable.
- By default Links will open following the viewer’s browser preferences. Select a different behaviour if you want links to always open in a new tab or a new browser window. If you want, set a different colour to display links.
- Set the Zoom and Fit to change how your diagram is displayed in the viewer.
- Deselect All Pages if you only want to include the current page of your diagram.
- Deselect the Layers checkbox if you don’t want viewers to interact with the layers in your diagram.
- To open your diagram directly in the draw.io editor, deselect the Lightbox checkbox.
- You will be prompted to save a HTML file containing your diagram. Choose where you want to save the file.
You can now share the HTML file which contains your diagram, open it in a web browser or even look at the HTML source code (this looks very similar to the link generated when you export your diagram to a URL).
When someone views the HTML version of your diagram, they can click on the diagram and will be able to step through pages, hide or display diagram layers and open the diagram in the editor, unless you have deselected these options before exporting.
