---
title: "Edit Mermaid diagrams with a live preview"
author: "Letter.md Official Content"
canonical: "https://letter-official-source.letter.pub/official-changelog-mermaid-live-preview-en"
published_at: "2026-08-29T09:34:46Z"
updated_at: "2026-08-29T09:34:46Z"
description: "Write Mermaid source beside a live diagram preview, with a responsive layout for narrow screens."
---

# Edit Mermaid diagrams with a live preview

Technical diagrams can now stay inside the Markdown document and remain comfortable to edit.

## What changed

- Edit Mermaid source and see the rendered diagram update beside it.
- Keep source and preview aligned on wide screens.
- Stack both panes on narrow screens without horizontal overflow.
- Use the document theme when rendering light and dark diagrams.
- Save standard Mermaid Markdown that remains readable outside Letter.md.

Invalid source stays editable and shows an error without replacing the last useful diagram.