A live-preview editor
Code, a large live preview and a settings inspector, all visible at once. The diagram is shown on a simulated Confluence page, in light or dark.
Atlasmaid renders Mermaid diagrams on Confluence Cloud pages. Write the code in a live-preview editor and get crisp, scalable diagrams that follow light and dark mode. Everything renders in the browser, and no data leaves Confluence.

Authors get a proper editor, readers get a diagram they can explore, and your data stays where it already lives.
Code, a large live preview and a settings inspector, all visible at once. The diagram is shown on a simulated Confluence page, in light or dark.
A toolbar on hover offers zoom, copy code, SVG and PNG download, and a full-screen viewer. Diagrams stay sharp at any size.
No external network calls, no backend and no storage. Diagram code and settings live inside the Confluence page, under your site's normal permissions.
Insert with /mermaid or from Insert elements → Data & charts and the editor opens straight away. Code on the left, a large live preview in the centre, collapsible settings on the right.




When the Mermaid code has a mistake, the failing line is underlined and marked in the gutter. The preview explains the problem, and an Error on line N badge and a Go to line button take you straight to it.
Save anyway keeps work in progress, so an unfinished diagram never costs you your changes.


Diagrams are scalable SVG and follow Confluence's light and dark mode. On Auto, dark themes get a dark background and light themes get white on a dark page, so they stay readable in both.
Pick a preset, or fine-tune every detail. Settings are saved with the macro, so each diagram can look different.
Choose from rendered swatches: Default, Neutral, Neo, Redux, Redux Color, Dark, Neo Dark, Redux Dark and Redux Dark Color. Auto follows Confluence light and dark.
Classic, Neo or Hand-drawn.
Curved (dagre) or Right-angle (ELK layout).
Fit the page width, natural size or a fixed height, aligned left, centre or right.
Auto, Transparent, Theme color or Custom color, with no frame, a border or a card.
Add a caption and an optional View Mermaid code section under the diagram.
Documentation, Presentation or Minimal, and Reset settings to go back to the defaults.
Choose which toolbar buttons readers see.
A config: block or %%{init}%% directive in the code wins. Those settings show as Set in code and are locked.
Everything renders in the reader's browser. Nothing leaves your Confluence site.
The manifest declares no external hosts. Mermaid, ELK and CodeMirror are bundled into the app, so no CDN, fonts or scripts load from outside.
No Forge functions, no OAuth scopes and no Forge storage. Diagram code and settings are stored inside the Confluence page, under the site's normal permissions, retention and backup.
No analytics, cookies or telemetry.
Mermaid runs with securityLevel: 'strict', which sanitises the SVG and disables scripts and click handlers inside diagrams.
Inline styles (content.styles: unsafe-inline), because Mermaid styles its SVGs inline.
Downloads and copies happen in the browser, and only when the user asks.
A few honest limits, so there are no surprises.
fa:fa-…, icon packs) and external images don't load, because the app makes no network calls.