Skip to content

Mermaid diagrams inside Confluence and Jira

Write Mermaid, see the diagram as you type, and keep the code next to the documentation it explains. Version 12.1 renders the same as mermaid.live.

Runs on Atlassian

Diagrams that stay in sync with the docs

Every diagram type

Flowchart, sequence, class, state, ER, Gantt, mind map, Kanban, packet, Venn and more.

Architecture with icons

Draw cloud and service diagrams with product logos and general icons that ship inside the app.

Themes and looks

The neo and hand-drawn looks, themes with dark variants, and diagrams that follow each reader’s light or dark mode.

Snippet gallery

Start from a pre-rendered snippet instead of a blank editor.

Diagrams from Jira text

Mermaid code in descriptions and comments shows up as diagrams, and you can edit it where it is.

Export PNG and SVG

Save a diagram as an image for slides, PDFs or documentation outside Atlassian.

Add a diagram in seconds

  1. Step 1

    Insert the macro

    Add Mermaid Diagrams to a Confluence page or a Jira work item.

  2. Step 2

    Write or paste Mermaid

    Type the code or paste it from mermaid.live, an AI tool or a repo, and watch the preview.

  3. Step 3

    Save

    The diagram renders on the page, and the code stays with it for the next edit.

Put the diagram next to the text it explains

Free for sites with up to 10 users. Larger teams get a 30-day trial on the Atlassian Marketplace.