Code
1 / 1
O Editor LaTeX mostra o seu código e as páginas diagramadas lado a lado. O que você digita aparece nas páginas na hora - títulos, listas, tabelas, fórmulas, notas de rodapé e referências - e um clique em qualquer texto da visualização leva você ao lugar dele no código. Você também pode editar o texto direto na página. Assim fica rápido escrever cartas, listas de exercícios, relatórios e folhetos sem instalar o TeX.
Tudo roda no seu navegador. Os documentos não são enviados, não há cadastro nem publicidade.
Comandos, ambientes, fórmulas e comentários em cores próprias, números de linha, \end{…} automático e uma lista clara dos problemas com a linha de cada um.
A4, Letter ou o seu próprio tamanho de papel, as margens das classes padrão ou do geometry, números de página, notas de rodapé no pé da página e as fontes Latin Modern do LaTeX.
Fórmulas no texto e em destaque, equações numeradas, align, matrizes e os símbolos do amsmath - diagramados com KaTeX, direto na página.
tabular e tabularx com linhas e células mescladas, figuras com legenda, \label e \ref, sumário e bibliografia.
Arraste uma imagem para o editor e use-a com \includegraphics. As imagens ficam guardadas com o documento no seu navegador.
PDF pela janela de impressão, cada página como PNG, JPG ou WebP, um arquivo HTML, texto simples, ou o código-fonte LaTeX com as imagens em ZIP.
Qualquer página https (e localhost) pode incorporar o editor com um <iframe> e ?embed=1 - sem cadastro, sem chave. Incorporado, o editor oculta este texto e mostra um botão Salvar. Há dois jeitos de levar o documento para dentro e para fora.
src= abre um arquivo (seu servidor precisa permitir CORS), webhook= faz "Salvar" (Ctrl+S) enviar o documento para esse endereço. Acrescente &token=… para um cabeçalho Authorization: Bearer … e &auto para salvar após cada alteração.
<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>O webhook recebe um POST com JSON { editor, event: "save", id, name, content, assets, updated }. Um pequeno script PHP que o guarda:
<?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}';O editor diz latexeditor:ready, a sua página responde com latexeditor:load, o editor informa latexeditor:loaded, latexeditor:change em edições reais e latexeditor:save quando o usuário salva. A sua página pode enviar latexeditor:get (o estado atual) ou latexeditor:save (apertar Salvar). Salvar passa então pelo seu próprio login e sessão.
<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') { // o editor está pronto: entregue o documento a ele
ed.contentWindow.postMessage({
type: 'latexeditor:load',
name: 'Flyer',
content: await (await fetch('/docs/flyer.tex')).text(),
assets: { 'logo.png': 'data:image/png;base64,…' } // imagens opcionais
}, ORIGIN);
}
if (m.type === 'latexeditor:change') document.title = '● not saved'; // uma edição real
if (m.type === 'latexeditor:save') { // o usuário clicou em "Salvar"
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';
}
});
// Um botão de salvar na sua própria página: a resposta chega como latexeditor:save
function saveNow() { ed.contentWindow.postMessage({ type: 'latexeditor:get' }, ORIGIN); }
</script>Assistente de IA dentro da sua página: ele também funciona no frame. Com allow="clipboard-write" no iframe, "Copiar prompt" usa a área de transferência diretamente (senão o editor recorre ao antigo comando de copiar, ou mostra o prompt para copiar à mão). Um link enviado pela IA não alcança um editor dentro de outro site, então o editor pede à IA e ao usuário que colem a resposta inteira da IA no editor - ou abram o editor em uma janela própria.
window.open("https://latex.giit.ch/?embed=window", "latexeditor-17") abre o editor completo em uma janela própria e troca as mesmas mensagens com window.opener. Os links de uma IA chegam até ele ali. latexeditor:load também pode levar context: { host, title, rules } - o prompt da IA então diz a que lugar o documento pertence e segue as suas regras - e hook: { url, token, assets: false }, um webhook só para este documento que nunca é guardado. Fechar a janela com alterações não salvas envia latexeditor:closing.
Entregue ao editor o seu próprio prompt, um endereço no seu site e uma chave para esta sessão do editor. A janela de IA mostra então "Conectado a" o seu site, o que você diz à IA, e a escolha alterar o documento atual ou criar um novo; Copiar prompt junta tudo. A IA envia o resultado com a chave para o seu servidor, e a sua página o abre no editor - um novo documento abre separado e fica no navegador do usuário. Uma chave por sessão do editor: ela vale enquanto o editor estiver aberto, e só enquanto não tiver nenhuma o editor a pede com latexeditor:key-request. O editor nunca envia a chave por conta própria e nunca a guarda; o endereço precisa ser https no seu próprio host ou em um subdomínio dele.
const key = async () => (await fetch('/api/ai-key.php?doc=17')).json(); // uma chave por sessão do editor
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);
// guarde o id de latexeditor:loaded e ignore change/save/closing com outro id
// só enquanto o editor não tiver chave:
if (m.type === 'latexeditor:key-request') { const k = await key(); ed.contentWindow.postMessage({ type: 'latexeditor:ai', key: k.key }, ORIGIN); }
// enquanto o editor estiver aberto, avise o seu servidor a cada minuto; fechar o editor ou a página invalida a chave
setInterval(() => fetch('/api/ai-key.php?alive=' + k.key.slice(0, 8)), 60000);
// o seu servidor tem um resultado (polling, SSE …): target é "current" ou "new"
ed.contentWindow.postMessage({ type: 'latexeditor:load', name: 'Flyer', content: draft, from: 'ai', target }, ORIGIN);<?php // api/ai-key.php - a chave desta sessão do editor do usuário logado (a sua página a chama)
session_start(); // verifique se o usuário pode editar este documento
$key = bin2hex(random_bytes(24));
$_SESSION['ai'][hash('sha256', $key)] = ['doc' => (int)$_GET['doc'], 'seen' => time()]; // ou no seu banco de dados; ?alive= atualiza seen
echo json_encode(['key' => $key]);
<?php // api/ai-result.php - a IA envia para cá (sem cabeçalhos CORS: as IAs chamam a partir de um servidor)
$key = preg_replace('/^Bearer\s+/', '', $_SERVER['HTTP_AUTHORIZATION'] ?? '');
$row = find_key(hash('sha256', $key)); // o seu banco de dados: não invalidada, vista nos últimos 3 minutos
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'); // a sua página o mostra com latexeditor:load
echo '{"ok":true}';Crie chaves com pelo menos 128 bits aleatórios, guarde só o hash delas, vincule cada uma ao usuário logado, ao documento e a esta sessão do editor, crie uma por sessão, mantenha-a válida só enquanto a sua página informar que a sessão está aberta, e invalide-a quando o editor ou a página fechar.
O protocolo completo está em llms.txt - entregue-o a uma IA e ela monta a conexão para o seu sistema. O Editor SVG funciona do mesmo jeito com o prefixo svgeditor: - svg.giit.ch.
Não. O editor roda inteiramente no seu navegador. Seus documentos e imagens nunca são enviados a um servidor, a não ser que você mesmo configure um webhook para o seu próprio servidor.
Clique em "Exportar", escolha PDF e clique em "Imprimir / Salvar como PDF". Na janela de impressão, escolha "Salvar como PDF" como impressora. As páginas saem exatamente como na visualização, com texto selecionável.
Não. O próprio editor diagrama o LaTeX no navegador. Ele entende os comandos que a maioria dos documentos usa - seções, listas, tabelas, figuras, fórmulas, cores, notas de rodapé, referências. Desenhos TikZ e fontes fontspec não são exibidos; o código continua sendo LaTeX válido, que você pode compilar com pdflatex a qualquer momento.
Arraste ou cole uma imagem no editor, ou adicione-a na aba Imagens, à direita. Ela fica guardada com o documento no seu navegador e é usada por \includegraphics{name}.
Só no seu navegador. Clique no botão de pasta no canto superior esquerdo (Meus documentos) para abrir, renomear, duplicar, baixar ou excluir os documentos. Limpar os dados do site no navegador os apaga, então baixe os que você quer manter - ou deixe o editor enviá-los ao seu próprio servidor ("Salvar no servidor").
Sim, qualquer IA - ChatGPT, Claude, Gemini, Copilot ou a IA da sua ferramenta de programação. Clique em "Assistente de IA", depois em "Copiar prompt", cole na sua IA e diga o que ela deve escrever. A IA responde com um link; clique nele e o documento aparece no seu editor. "Desfazer" desfaz qualquer alteração.
Sim. Incorpore-o com um iframe e troque documentos com postMessage, ou deixe-o enviar cada versão salva ao seu servidor com um webhook. Veja exemplos em Use o editor no seu próprio site.
Não. O editor é gratuito, sem anúncios e sem cadastro.