The editor & blocks

A tela page is markdown underneath — pages.body is canonical markdown, forever. The editor and reader render a rich block palette well beyond plain markdown, and every block round-trips to readable markdown, so nothing locks you in.

[!TIP] Type / on an empty line to open the slash menu and insert any block by name. Start typing to filter (e.g. /call, /mermaid, /table).

Standard markdown works as you'd expect — # headings, -/1. lists, **bold**, [links](…), > quotes, --- dividers, inline `code` and ==highlight==.

Block reference

[!NOTE] Math uses double dollars, so prices are safe. A single $ is never treated as math — write $3,500 and $2,500 in the same paragraph and both render as text. Inline math needs $$…$$ (typing $x^2$ in the editor still converts it, and saves as $$x^2$$).

These same blocks are what an AI agent gets when it writes a tela page — see [[Agents & MCP]].

See it in action

A callout sets an aside apart:

[!IMPORTANT] Everything you see in this reader is plain markdown in the page body. Open this page in the editor to read the source.

Tabs show alternatives in one spot:

:::tabs

Slash menu

Type / on an empty line, then filter by name.

Drag & drop

Drop an image or file onto the page — it uploads and inserts itself. :::

A table with check/cross cells renders as a feature matrix:

Slide decks

A page can be a slide deck instead of a document — the whole page becomes a presentation, styled automatically from plain markdown. Turn it on from the page ⋯ menu → Convert to slide deck. See [[Presentations & decks]].

When the render doesn't match what you wrote

Some markdown renders differently from how it reads. Misname a block (:::callout instead of a > [!NOTE] callout) and the reader shows its contents without the frame. Paste raw HTML and it is dropped — the text between the tags survives, the tags and their styling do not. Leave out the blank lines around a collapsible's body and the whole collapsible disappears. In every case the page still looks fine; it just isn't what you meant, and re-reading your markdown won't show you that.

While you edit, tela checks for exactly these cases and lists what it finds under the editor, headed Renders differently than written. Each line names what the reader will do and how to fix it. It never blocks a save, and it stays hidden when there is nothing to report.

Agents get the same check as the lint_page tool, plus preview_page, which renders a page and reads it back so an agent can see its own output — see [[Agents & MCP]].

Worth knowing

• Read mode. A distraction-free, full-bleed reading view — larger type, an on-page table of contents, and a reading-progress bar, plus size / typeface / theme controls. Click Read mode in the page header (on a phone it's in the page ⋯ menu), or add ?view=read to any page URL.

• The page header on a phone. Narrow screens keep the bar to what you need — the page title, Edit, and ⋯ — and fold the rest (Read mode, Comments, page connections, favorite, follow) into that ⋯ menu. The bar stays pinned to the top as you scroll, so Edit is always one tap away. The ‹ at the left goes up one level.

• Tables get smart in the reader. A cell that's exactly check / cross / dash (or ✓/✗/–) renders as a colored icon. The first column pins on horizontal scroll, and tables of 8+ rows get sortable headers + a filter box.

• Charts support bar / grouped / stacked / line / area / scatter / pie / donut, follow the page theme, and are interactive (hover tooltips, clickable legend).

• Drawings are multiplayer. Open the same drawing in two browsers (or with a teammate) and strokes + cursors sync live. It autosaves while you work and on close — no Save step — and merges per shape, so two people drawing at once don't clobber each other.

• Wikilinks resolve by page title within the space and record a backlink, so "what links here" builds itself.

• Images & files upload automatically on drag-drop or paste. A PDF attachment renders as a card with a Preview button — read it inline (paged, zoomable) without downloading.

• Page properties. Frontmatter on a synced/imported page (or props set via the API/MCP) shows behind the {} icon in the page header.

• Summaries are automatic. When an LLM is configured (TELA_LLM_URL), every non-empty page gets a 1–2 sentence summary property, regenerated in the background when the body changes. Hover the page title for the summary card; on public spaces it doubles as the post excerpt and meta description. Pin a hand-written one with summary_lock: true. Settings → Summaries shows generation status across your spaces.

• Mermaid diagrams follow the page theme. A ```mermaid block covers flowcharts and sequence, class, state, ER, gantt, pie, git and journey diagrams — all recoloured automatically for the active theme (light / dark / warm). Two opt-in styles are available via a YAML frontmatter block at the top of the diagram: a hand-drawn sketch look, and the ELK layout engine for tighter routing on dense graphs.

  ```mermaid
  ---
  config:
    look: handDrawn   # sketch style (default is clean lines)
    layout: elk       # tighter routing for busy graphs (default is dagre)
  ---
  flowchart LR
    A[Start] --> B[End]
  ```