Live Preview

Tachi Code renders many file types in a dedicated preview pane alongside the editor, so you can see your changes as you make them. Some file types — like CSV — can even be edited directly in the preview.

Supported file types

Each file type has its own preview, with behavior and settings tailored to it:

Markdown Live preview with LaTeX math, Mermaid diagrams, and print-to-PDF export.

Mermaid Render flowcharts, sequence diagrams, Wardley maps, and dozens of other diagram types.

SVG Preview vector graphics rendered exactly as a browser would display them.

CSV & TSV View and edit delimited data in a spreadsheet-style grid.

Images View raster images inline with zoom, pan, and dimensions.

JSON & JSONPath Drill into large JSON documents with a JSONPath filter pane.

Opening a preview

Most file types open their preview automatically in a split view alongside the editor. The exact controls vary by file type — see each file type’s page for the details — but the general flow is the same:

1. Open a previewable file in the editor.
2. Use the preview buttons in the editor’s action bar to show, hide, or expand the preview. For text-based previews you can also cycle through layouts with Shift + Command + V ShiftCommandV Shift + Control + V ShiftControlV .

Preview layouts

The text-based previews — Markdown, Mermaid, and SVG — can be arranged in a few layouts:

Side by side (horizontal split)

Top and bottom (vertical split)

Fullscreen (source is hidden)

Each of these previews remembers a default layout that you can configure with its own defaultMode setting, documented on its page.