Callouts, toggles, tables, code blocks, HTML blocks

Beyond plain text, the editor ships structured blocks for notes, collapsible sections, tabular data, code, and even raw HTML — each with sensible defaults and safe rendering.

Callouts

Five variants, each with its own color and icon: Info, Warning, Tip, Danger, Success. Change a callout's variant from its toolbar. Callouts are the right way to flag caveats and prerequisites — they survive markdown export and render on the public help center.

Toggles

A Toggle is a collapsible section with a title. Click the arrow to expand/collapse; whether it's open or closed is saved with the document. Use toggles for FAQ answers, advanced configuration, and appendices.

Tables

• Insert a 2×2 table with a header row, or paste CSV/TSV to create one automatically.

• Resizable columns — drag the column edge.

• Header-row styling, cell selection, and row/column add/delete from the table controls that appear on focus.

• Tables export cleanly to Markdown and render on the public help center.

Code blocks

Fenced code blocks with syntax highlighting and language labeling — plus two special languages, Mermaid and nwdiag, that render as live diagrams instead of code (see Diagrams in docs). The placeholder stays empty for a clean editing canvas. Copy buttons and language selection appear on hover.

Diagrams

Diagram blocks are code blocks with a special language, so they stay addressable, commentable, and diffable like any other block. Mermaid renders flowcharts and sequence diagrams; nwdiag renders network topology. Both render on the public help center. Everything else — syntax, the Diagram/Source toggle, and how the code-based options compare with Excalidraw — lives on the Diagrams in docs page.

• There is no /mermaid slash command — insert a Code block and switch its language to Mermaid or nwdiag.

• Mermaid (flowcharts, sequence diagrams) and nwdiag (network topology) both render on the public help center.

• Syntax, the Diagram/Source toggle, and the Mermaid / nwdiag / Excalidraw choice: see Diagrams in docs.

• For freehand whiteboarding instead, use the Excalidraw block.

HTML blocks

For content the structured blocks can't express, the HTML block takes custom markup. It's safe by default:

• Markup is sanitized before it's displayed and before export.

• Allowed: structural tags (div/section/article…), text, lists, headings, tables, links, and images, with a limited set of attributes.

• Styling is limited to a safe set of CSS properties (layout, spacing, color, typography) — scripts, event handlers, iframes, and dangerous styles are stripped.

• The block shows a preview while you edit the markup, so mistakes surface immediately.

When to use what

Need	Use
Highlight a caveat	Callout
Hide optional detail	Toggle
Structured data	Table (or paste CSV)
Code sample	Code block
Diagram	Code block with a Mermaid or nwdiag language
Bespoke layout/branding	HTML block (sanitized)