LaTeX Editor online

Code

Export

The print dialog opens with exactly the pages of the preview. Choose Save as PDF (or "Microsoft Print to PDF") as the printer. In Chrome and Edge, untick "Headers and footers" if the browser offers it. The text in the PDF stays sharp and can be selected.

My documents

Click a document to open it. They are stored only in this browser - nothing is uploaded. Clearing the browser's site data removes them, so download the ones you want to keep.

AI Assistant

Any AI can write with you - ChatGPT, Claude, Gemini, Copilot.

  1. Click Copy prompt.
  2. Paste it into your AI and say what it should write.
The AI should

The document travels in the link after the “#”, which no server sees. What you paste into your AI is handled by its provider.

Save to your server

The editor can send each saved version to your own server (a webhook), so your work is kept where you want it. Nothing is sent until you enter an address here.

What your server receives

A POST request with JSON (your server must allow CORS from https://latex.giit.ch):

{ "editor": "latex", "event": "save", "id": "…", "name": "Report",
  "content": "\\documentclass{article} …",
  "assets": { "logo.png": "data:image/png;base64,…" },
  "updated": "2026-01-15T09:30:00.000Z" }
Embed the editor in your website
<iframe src="https://latex.giit.ch/?embed=1" style="width:100%;height:80vh;border:0"></iframe>
<script>
const frame = document.querySelector('iframe');
addEventListener('message', e => {
  if (e.origin !== 'https://latex.giit.ch' || e.source !== frame.contentWindow) return;
  if (e.data.type === 'latexeditor:ready')
    frame.contentWindow.postMessage({ type: 'latexeditor:load', name: 'Report',
      content: '\\documentclass{article}…', assets: {} }, 'https://latex.giit.ch');
  if (e.data.type === 'latexeditor:save') saveOnYourServer(e.data.content, e.data.assets);
});
</script>

Also possible: ?src=<URL of a .tex file> opens a file, &webhook=<URL> saves this document there. The editor can also open in a window of its own (?embed=window), and your page can hand it its own AI prompt and a session key so the AI sends its result to your server (latexeditor:ai, latexeditor:key-request) - see "Use the editor on your own website" below the editor. Details are in llms.txt.

Help

How it works

  1. Write LaTeX on the left - or start with New and one of the templates. The preview on the right shows the typeset pages as you type.
  2. Click text in the preview to edit it right there: the cursor is where you clicked, and the code's cursor goes to the same place. Enter or a click elsewhere writes the change into the code (one step for Undo), Escape cancels. A click on math, a picture or text made by a command jumps to its place in the code instead. The place where the code cursor is gets a frame in the preview.
  3. Document on the right sets paper, font, margins and title; Insert has ready-made pieces (lists, tables, math, symbols); Pictures holds the pictures of the document; Outline lists the sections.
  4. Problems in the code (a missing }, an unknown command) are listed above the code - click one to go there.
  5. My documents (the folder button at the top left) lists every document kept in this browser.
  6. Export makes a PDF (via the print dialog), pictures of the pages, an HTML page or plain text. Download .tex saves the code.

The preview is the editor's own typesetting and understands the commands most documents use. TikZ drawings and fontspec fonts are not shown - the code stays valid LaTeX that compiles with pdflatex.

Keyboard shortcuts

Ctrl + B / I / U
Bold / italic / underline the selected text
Ctrl + M
Math: $…$ around the selection
Ctrl + /
Comment lines in or out (%)
Ctrl + Enter
Show the cursor's place in the preview
Tab / Shift + Tab
Indent / outdent
Ctrl + Z / Y
Undo / redo
Ctrl + S / E
Save (download .tex, or to your server) / export
Ctrl + O
My documents
Ctrl + P
Print / save as PDF
Ctrl + mouse wheel, Ctrl + + -
Zoom the preview
Page Up / Page Down
Previous / next page (in the preview)

Typing \begin{name} and pressing Enter adds the matching \end{name}. Brackets { [ ( and $ close by themselves around a selection.

Пишите LaTeX онлайн с живым предпросмотром

Редактор LaTeX показывает ваш код и свёрстанные страницы рядом. Всё, что вы набираете, сразу появляется на страницах - заголовки, списки, таблицы, формулы, сноски и ссылки, - а щелчок по любому тексту в предпросмотре переносит вас к его месту в коде. Текст можно править и прямо на странице. Так можно быстро писать письма, листы заданий, отчёты и флаеры, не устанавливая TeX.

Всё работает в вашем браузере. Документы никуда не загружаются, нет регистрации и нет рекламы.

Что умеет редактор

Код с подсветкой

Команды, окружения, формулы и комментарии своими цветами, номера строк, автоматический \end{…} и понятный список проблем с номером строки.

Страницы такие, как при печати

A4, Letter или свой размер бумаги, поля стандартных классов или geometry, номера страниц, сноски внизу страницы и шрифты Latin Modern из LaTeX.

Формулы

Формулы в строке и выключные, нумерованные уравнения, align, матрицы и символы amsmath - свёрстанные с KaTeX прямо на странице.

Таблицы, рисунки, ссылки

tabular и tabularx с линиями и объединёнными ячейками, рисунки с подписями, \label и \ref, оглавление и список литературы.

Изображения

Перетащите изображение в редактор и используйте его через \includegraphics. Изображения хранятся вместе с документом в вашем браузере.

Экспорт

PDF через диалог печати, каждая страница как PNG, JPG или WebP, один файл HTML, простой текст или исходник LaTeX с изображениями в ZIP.

Как это работает

  1. Начните - выберите шаблон в меню «Новый», откройте файл .tex или вставьте код LaTeX.
  2. Пишите - набирайте код; страницы справа следуют за ним. Таблицы, списки и формулы - в меню «Вставка».
  3. Экспортируйте - сохраните PDF, изображения страниц или файл .tex.

Редактор на вашем сайте

Любая страница на https (и localhost) может встроить редактор через <iframe> и ?embed=1 - без регистрации и без ключа. Во встроенном виде редактор скрывает этот текст и показывает кнопку «Сохранить». Есть два способа передать документ в редактор и получить его обратно.

1. Открыть файл по ссылке, сохранять на ваш сервер

src= открывает файл (ваш сервер должен разрешать CORS), webhook= заставляет «Сохранить» (Ctrl+S) отправлять документ на этот адрес. Добавьте &token=… для заголовка Authorization: Bearer … и &auto, чтобы сохранять после каждого изменения.

<iframe src="https://latex.giit.ch/?embed=1&src=https://your-site.com/docs/flyer.tex&webhook=https://your-site.com/save.php"
        allow="clipboard-write" style="width:100%;height:800px;border:0"></iframe>

Вебхук получает POST с JSON { editor, event: "save", id, name, content, assets, updated }. Небольшой PHP-скрипт, который его сохраняет:

<?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}';

2. Документ хранит ваша страница (postMessage)

Редактор сообщает latexeditor:ready, ваша страница отвечает latexeditor:load, редактор сообщает latexeditor:loaded, latexeditor:change при настоящих правках и latexeditor:save, когда пользователь сохраняет. Ваша страница может отправить latexeditor:get (текущее состояние) или latexeditor:save (нажать «Сохранить»). Сохранение тогда идёт через ваш собственный вход и сеанс.

<iframe id="ed" src="https://latex.giit.ch/?embed=1" allow="clipboard-write" 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') {             // редактор готов: передаём ему документ
    ed.contentWindow.postMessage({
      type: 'latexeditor:load',
      name: 'Flyer',
      content: await (await fetch('/docs/flyer.tex')).text(),
      assets: { 'logo.png': 'data:image/png;base64,…' }   // необязательные изображения
    }, ORIGIN);
  }
  if (m.type === 'latexeditor:change') document.title = '● not saved';   // настоящая правка
  if (m.type === 'latexeditor: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';
  }
});

// Кнопка сохранения на вашей странице: ответ приходит как latexeditor:save
function saveNow() { ed.contentWindow.postMessage({ type: 'latexeditor:get' }, ORIGIN); }
</script>

ИИ-ассистент внутри вашей страницы: он работает и во фрейме. С allow="clipboard-write" на iframe кнопка «Копировать промпт» напрямую использует буфер обмена (иначе редактор переходит на старую команду копирования или показывает промпт для ручного копирования). Ссылка, которую присылает ИИ, не может попасть в редактор внутри другого сайта, поэтому редактор просит ИИ и пользователя вставить весь ответ ИИ в редактор - или открыть редактор в отдельном окне.

3. В отдельном окне

window.open("https://latex.giit.ch/?embed=window", "latexeditor-17") открывает полный редактор в отдельном окне и обменивается теми же сообщениями с window.opener. Ссылки от ИИ попадают туда. latexeditor:load может также содержать context: { host, title, rules } - тогда промпт для ИИ говорит, к чему относится документ, и следует вашим правилам, - и hook: { url, token, assets: false }, вебхук только для этого документа, который никогда не сохраняется. При закрытии окна с несохранёнными изменениями отправляется latexeditor:closing.

4. ИИ через ваш собственный сервер

Передайте редактору свой промпт, адрес на вашем сайте и ключ для этого сеанса редактора. Тогда диалог ИИ показывает «Подключено к» вашему сайту, что вы сообщаете ИИ, и выбор изменить текущий документ или создать новый; Копировать промпт собирает всё вместе. ИИ отправляет свой результат с ключом на ваш сервер, а ваша страница открывает его в редакторе - новый документ открывается отдельно и остаётся в браузере пользователя. Один ключ на сеанс редактора: он действует, пока редактор открыт, и только пока ключа нет, редактор запрашивает его через latexeditor:key-request. Редактор никогда сам не отправляет ключ и никогда не сохраняет его; адрес должен быть https на вашем собственном хосте или его поддомене.

const key = async () => (await fetch('/api/ai-key.php?doc=17')).json();   // один ключ на сеанс редактора
const k = await key();
ed.contentWindow.postMessage({ type: 'latexeditor:load', name: 'Flyer', content, ai: {
  label: 'My Site', prompt: 'Keep the [[placeholders]]. Write in German.',
  endpoint: 'https://your-site.com/api/ai-result.php', key: k.key } }, ORIGIN);
// запомните id из latexeditor:loaded и игнорируйте change/save/closing с другим id
// только пока у редактора нет ключа:
if (m.type === 'latexeditor:key-request') { const k = await key(); ed.contentWindow.postMessage({ type: 'latexeditor:ai', key: k.key }, ORIGIN); }
// пока редактор открыт, сообщайте серверу каждую минуту; закрытие редактора или страницы аннулирует ключ
setInterval(() => fetch('/api/ai-key.php?alive=' + k.key.slice(0, 8)), 60000);
// у вашего сервера есть результат (polling, SSE …): target - "current" или "new"
ed.contentWindow.postMessage({ type: 'latexeditor:load', name: 'Flyer', content: draft, from: 'ai', target }, ORIGIN);
<?php // api/ai-key.php - ключ этого сеанса редактора для вошедшего пользователя (его вызывает ваша страница)
session_start();                                     // проверьте, что пользователь может редактировать этот документ
$key = bin2hex(random_bytes(24));
$_SESSION['ai'][hash('sha256', $key)] = ['doc' => (int)$_GET['doc'], 'seen' => time()];  // или в вашей базе данных; ?alive= снова обновляет seen
echo json_encode(['key' => $key]);

<?php // api/ai-result.php - сюда отправляет ИИ (без заголовков CORS: ИИ вызывает его с сервера)
$key = preg_replace('/^Bearer\s+/', '', $_SERVER['HTTP_AUTHORIZATION'] ?? '');
$row = find_key(hash('sha256', $key));               // ваша база данных: не аннулирован, seen за последние 3 минуты
if (!$row) { http_response_code(401); exit('{"ok":false,"error":"key not valid"}'); }
$d = json_decode(file_get_contents('php://input', false, null, 0, 2000000), true);
save_draft($row['doc'], $d['content'], $d['target'] === 'new' ? 'new' : 'current');   // ваша страница показывает его через latexeditor:load
echo '{"ok":true}';

Создавайте ключи минимум из 128 случайных бит, храните только их хеш, привязывайте каждый к вошедшему пользователю, документу и этому сеансу редактора, создавайте один ключ на сеанс, считайте его действительным, только пока ваша страница сообщает, что сеанс открыт, и аннулируйте его, когда редактор или страница закрываются.

Весь протокол описан в llms.txt - дайте его ИИ, и он построит подключение для вашей системы. Редактор SVG работает так же с префиксом svgeditor: - svg.giit.ch.

Частые вопросы

Мой документ куда-то загружается?

Нет. Редактор полностью работает в вашем браузере. Ваши документы и изображения никогда не отправляются на сервер, если только вы сами не настроите вебхук на свой собственный сервер.

Как получить PDF?

Нажмите «Экспорт», выберите PDF и нажмите «Печать / Сохранить в PDF». В диалоге печати выберите в качестве принтера «Сохранить как PDF». Страницы получатся точно такими же, как в предпросмотре, с выделяемым текстом.

Нужна ли установка TeX?

Нет. Редактор сам верстает LaTeX в браузере. Он понимает команды, которые используются в большинстве документов, - разделы, списки, таблицы, рисунки, формулы, цвета, сноски, ссылки. Рисунки TikZ и шрифты fontspec не показываются; код остаётся корректным LaTeX, который можно в любой момент скомпилировать pdflatex.

Как добавить изображения?

Перетащите или вставьте изображение в редактор или добавьте его во вкладке Изображения справа. Оно хранится вместе с документом в вашем браузере и используется через \includegraphics{name}.

Где сохраняются мои документы?

Только в вашем браузере. Нажмите кнопку с папкой вверху слева («Мои документы»), чтобы открывать, переименовывать, дублировать, скачивать или удалять их. Очистка данных сайта в браузере удалит их, поэтому скачайте те, которые хотите сохранить, - или пусть редактор отправляет их на ваш собственный сервер («На сервер»).

Может ли ИИ писать в редакторе LaTeX?

Да, любой ИИ - ChatGPT, Claude, Gemini, Copilot или ИИ в вашем инструменте для программирования. Нажмите «ИИ-ассистент», затем «Копировать промпт», вставьте его в свой ИИ и скажите, что нужно написать. ИИ ответит ссылкой; щёлкните по ней, и документ появится в вашем редакторе. «Отменить» возвращает любое изменение.

Можно ли использовать редактор на моём сайте?

Да. Встройте его через iframe и обменивайтесь документами через postMessage или пусть он отправляет каждую сохранённую версию на ваш сервер через вебхук. Примеры - в разделе Редактор на вашем сайте.

Сколько стоит редактор LaTeX?

Нисколько. Редактор бесплатный, без рекламы и без регистрации.