Diagrams.net

{{< details >}}

• Tier: Free, Premium, Ultimate
• Offering: GitLab Self-Managed, GitLab Dedicated

{{< /details >}}

{{< history >}}

• Offline environment support introduced in GitLab 16.1.

{{< /history >}}

Use the diagrams.net integration to create and embed SVG diagrams in wikis. The diagram editor is available in both the plain text editor and the rich text editor.

This integration is available to all GitLab.com users and requires no additional configuration.

For GitLab Self-Managed and GitLab Dedicated, integrate with either the free diagrams.net website, or host your own diagrams.net site in offline environments.

To set up the integration:

1. Choose to integrate with the free diagrams.net website or configure your diagrams.net server.
2. Enable the integration.

After completing the integration, the diagrams.net editor opens with the URL you provided.

Configure your diagrams.net server

You can set up your own diagrams.net server to generate diagrams. For GitLab Self-Managed offline installations, this step is required.

To run a diagrams.net container in Docker, run the following command:

docker run -it --rm --name="draw" -p 8006:8080 -p 8443:8443 jgraph/drawio

[!note] Use port 8006 for the HTTP endpoint. You should avoid the default port 8080 because Puma listens on port 8080 for metrics.

Note the hostname of the server running the container. You use this hostname as the diagrams.net URL when you enable the integration.

For more information, see run your own diagrams.net server with Docker.

Enable Diagrams.net integration

1. Sign in to GitLab as an Administrator user.
2. In the upper-right corner, select Admin.
3. Select Settings > General.
4. Expand Diagrams.net.
5. Select the Enable Diagrams.net checkbox.
6. Enter the Diagrams.net URL. To connect to:
   • The free public instance: enter https://embed.diagrams.net.
   • A locally hosted diagrams.net instance: enter the URL you configured earlier.
7. Select Save changes.