Code
1 / 1
The LaTeX Editor shows your code and the typeset pages side by side. Whatever you type appears on the pages right away - headings, lists, tables, math, footnotes and references - and a click on any text in the preview takes you to its place in the code. A double click lets you edit the text right on the page. That makes it quick to write letters, exercise sheets, reports and flyers without installing TeX.
Everything runs in your browser. Documents are not uploaded, there is no sign-up and no advertising.
Commands, environments, math and comments in their own colors, line numbers, automatic \end{…}, and a clear list of problems with their line.
A4, Letter or your own paper size, the margins of the standard classes or of geometry, page numbers, footnotes at the bottom of the page and the Latin Modern fonts of LaTeX.
Inline and displayed math, numbered equations, align, matrices and the symbols of amsmath - typeset with KaTeX, right on the page.
tabular and tabularx with rules and merged cells, figures with captions, \label and \ref, table of contents and bibliography.
Drag a picture into the editor and use it with \includegraphics. Pictures are kept with the document in your browser.
PDF through the print dialog, every page as PNG, JPG or WebP, one HTML file, plain text, or the LaTeX source with its pictures as ZIP.
Any https page (and localhost) can embed the editor with an <iframe> and ?embed=1 - no sign-up, no key. Embedded, the editor hides this text and shows a Save button. There are two ways to get the document in and out.
src= opens a file (your server must allow CORS), webhook= makes "Save" (Ctrl+S) send the document to that address. Add &token=… for an Authorization: Bearer … header and &auto to save after every change.
<iframe src="https://latex.giit.ch/?embed=1&src=https://your-site.com/docs/flyer.tex&webhook=https://your-site.com/save.php"
style="width:100%;height:800px;border:0"></iframe>The webhook gets a POST with JSON { editor, event: "save", id, name, content, assets, updated }. A small PHP script that stores it:
<?php
header('Access-Control-Allow-Origin: https://latex.giit.ch');
header('Access-Control-Allow-Headers: Content-Type, Authorization');
header('Access-Control-Allow-Methods: POST, OPTIONS');
if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') exit;
if (($_SERVER['HTTP_AUTHORIZATION'] ?? '') !== 'Bearer SECRET') { http_response_code(403); exit; }
$d = json_decode(file_get_contents('php://input'), true);
$name = preg_replace('/[^\w\- ]/u', '_', $d['name']);
file_put_contents(__DIR__ . "/docs/$name.tex", $d['content']);
echo '{"ok":true}';The editor says latexeditor:ready, your page answers with latexeditor:load, the editor reports latexeditor:loaded, latexeditor:change on real edits and latexeditor:save when the user saves. Your page may send latexeditor:get (the current state) or latexeditor:save (press Save). Saving then goes through your own login and session.
<iframe id="ed" src="https://latex.giit.ch/?embed=1" style="width:100%;height:800px;border:0"></iframe>
<script>
const ed = document.getElementById('ed');
const ORIGIN = 'https://latex.giit.ch';
addEventListener('message', async e => {
if (e.source !== ed.contentWindow || e.origin !== ORIGIN) return;
const m = e.data;
if (m.type === 'latexeditor:ready') { // the editor is ready: hand it the document
ed.contentWindow.postMessage({
type: 'latexeditor:load',
name: 'Flyer',
content: await (await fetch('/docs/flyer.tex')).text(),
assets: { 'logo.png': 'data:image/png;base64,…' } // optional pictures
}, ORIGIN);
}
if (m.type === 'latexeditor:change') document.title = '● not saved'; // a real edit
if (m.type === 'latexeditor:save') { // the user clicked "Save"
await fetch('/api/save', { method: 'POST', headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ name: m.name, content: m.content, assets: m.assets }) });
document.title = 'Saved';
}
});
// A save button on your own page: the answer comes as latexeditor:save
function saveNow() { ed.contentWindow.postMessage({ type: 'latexeditor:get' }, ORIGIN); }
</script>The whole protocol is in llms.txt - give it to an AI and it builds the connection for your system. The SVG Editor works the same way with the prefix svgeditor: - svg.giit.ch.
No. The editor runs entirely in your browser. Your documents and pictures are never sent to a server, unless you set up a webhook to your own server yourself.
Click "Export", choose PDF and click "Print / Save as PDF". In the print dialog choose "Save as PDF" as the printer. The pages come out exactly as in the preview, with selectable text.
No. The editor typesets LaTeX itself in the browser. It understands the commands most documents use - sections, lists, tables, figures, math, colors, footnotes, references. TikZ drawings and fontspec fonts are not shown; the code stays valid LaTeX that you can compile with pdflatex at any time.
Drag a picture into the editor or choose Insert > Pictures. It is stored with the document in your browser and used by \includegraphics{name}.
Only in your browser. Click the folder button at the top left (My documents) to open, rename, duplicate, download or delete them. Clearing your browser's site data removes them, so download the ones you want to keep - or let the editor send them to your own server ("Save to server").
Yes, any AI - ChatGPT, Claude, Gemini, Copilot or the AI in your coding tool. Click "AI Assistant", then "Copy prompt", paste it into your AI and say what it should write. The AI answers with a link; click it and the document appears in your editor. "Undo" takes every change back.
Yes. Embed it with an iframe and exchange documents with postMessage, or let it send every saved version to your server with a webhook. See Use the editor on your own website for examples.
No. The editor is free, without ads and without sign-up.