giit Editors

Kostenlose Online-Editoren mit Live-Vorschau - privat, KI-fähig, einbindbar

Eine Familie von Browser-Editoren für die Formate, die man täglich schreibt. Links der Code, rechts das Ergebnis, nichts wird hochgeladen. Jede KI kann mit einem Link darin schreiben, und jeder Editor lässt sich in die eigene Website einbauen.

  • Ohne Anmeldung, ohne Werbung
  • Deine Dateien bleiben im Browser
  • Jede KI kann darin schreiben
  • In die eigene Website einbinden
  • Deutsch und Englisch

Die Editoren

Jeder Editor ist für sein Format gemacht und funktioniert gleich wie die anderen.

  • LaTeX Editor

    latex.giit.ch

    LaTeX schreiben und die gesetzten Seiten sofort sehen. Bilder, Dokument-Einstellungen, PDF-Export.

    ● Online
  • SVG Editor

    svg.giit.ch

    SVG als Code und auf der Zeichenfläche: Formen verschieben, skalieren, einfärben, Raster, Export als PNG, JPG, WebP oder React.

    ● Online
  • HTML Editor

    html.giit.ch

    HTML mit Live-Vorschau der Seite, Bilder als Dateien, Text direkt in der Vorschau bearbeiten, Export als eine Datei oder ZIP.

    ● Online
  • Markdown Editor

    md.giit.ch

    Markdown mit Tabellen, Aufgabenlisten, Fussnoten und Formeln, lesbare Vorschau, Export als HTML oder PDF.

    ● Online
  • JSON Editor

    json.giit.ch

    JSON als Code und als aufklappbarer Baum: Schlüssel und Werte im Baum bearbeiten, gegen ein JSON Schema prüfen, in YAML, CSV oder XML umwandeln.

    ◌ In Entwicklung
  • YAML Editor

    yaml.giit.ch

    YAML mit demselben Datenbaum, Kommentare und Anker bleiben erhalten, Probleme mit Zeile, Umwandeln in JSON.

    ◌ In Entwicklung
  • XML Editor

    xml.giit.ch

    XML mit Elementbaum, XPath-Suche, Prüfung auf Wohlgeformtheit und Umwandeln in JSON oder YAML.

    ● Online
  • CSV Editor

    csv.giit.ch

    CSV als Text und als Tabelle wie in einer Tabellenkalkulation, auch für grosse Dateien; Export als XLSX, JSON, Markdown- oder HTML-Tabelle.

    ● Online
  • Typst Editor

    typst.giit.ch

    Typst mit dem echten Compiler im Browser: Seiten beim Tippen, PDF mit markierbarem Text, Bilder beim Dokument.

    ◌ In Entwicklung

Was jeder Editor kann

Wer einen kennt, kennt alle.

Privat von Grund auf

Die Editoren sind statische Seiten. Deine Dokumente bleiben in deinem Browser (lokaler Speicher); an einen Server geht nur etwas, wenn du deinen eigenen einrichtest.

Meine Dokumente

Beliebig viele Dokumente im Browser: öffnen, umbenennen, duplizieren, herunterladen und löschen, jedes mit eigenem Rückgängig.

Jede KI schreibt mit

«KI-Assistent» → «Prompt kopieren» gibt ChatGPT, Claude, Gemini oder Copilot alles Nötige. Die KI antwortet mit einem Link, der ihr Ergebnis in deinem Editor öffnet - Rückgängig nimmt es zurück.

Browser-Agenten (WebMCP)

In Browsern mit WebMCP bekommen KI-Agenten Werkzeuge, um das offene Dokument direkt zu lesen und zu ändern; jede Änderung ist ein Rückgängig-Schritt.

KI-Status auf einen Blick

Ein Punkt am KI-Knopf zeigt, ob eine KI angebunden ist: über deine Website, als Browser-Agent oder per Links in diesem Tab.

In der Vorschau bearbeiten

Text in der Vorschau anklicken und dort ändern; der Code zieht mit. Ein Klick anderswo springt an die Stelle im Code.

Auf dem eigenen Server speichern

Ein Webhook schickt jede gespeicherte Fassung an eine Adresse deiner Wahl, mit Token - automatisch oder mit Ctrl+S.

Deutsch oder Englisch

Mit ?lang=de ist die Oberfläche deutsch; die Wahl wird gemerkt. Der Prompt für die KI bleibt immer englisch.

Hell, dunkel oder automatisch

Jeder Editor folgt deinem System oder dem gewählten Farbschema und läuft auf Handy und Tablet.

Einen Editor in die eigene Website einbauen

Alle Editoren sprechen dasselbe Protokoll. Ersetze latex durch svg, html, md, json, yaml, xml, csv oder typst - die Nachrichten sind gleich, nur ihr Präfix ändert sich (latexeditor:, svgeditor: …).

Den Editor in die Seite setzen

Ein iframe genügt. ?embed=1 zeigt die schlanke Ansicht mit Speichern-Knopf, ?save=0 blendet ihn aus, wenn deine Seite einen eigenen hat, ?lang=de zeigt die deutsche Oberfläche.

<iframe id="ed" src="https://latex.giit.ch/?embed=1&lang=de"
        allow="clipboard-write" style="width:100%;height:80vh;border:0"></iframe>

Dokument laden, Änderungen und Speichern empfangen

Der Editor meldet sich bereit, deine Seite schickt das Dokument, und der Editor meldet echte Änderungen und jedes Speichern. Prüfe bei jeder Nachricht die Herkunft.

const ED = 'https://latex.giit.ch', ed = document.getElementById('ed');
addEventListener('message', e => {
  if (e.origin !== ED || e.source !== ed.contentWindow) return;
  const m = e.data;
  if (m.type === 'latexeditor:ready')
    ed.contentWindow.postMessage({ type: 'latexeditor:load', name: 'Offerte', content: meinText }, ED);
  if (m.type === 'latexeditor:change') alsUngespeichertMarkieren();
  if (m.type === 'latexeditor:save') aufDeinemServerSpeichern(m.content, m.assets);
});

Oder im eigenen Fenster öffnen

Der volle Editor im eigenen Fenster spricht genauso mit window.opener - und Links einer KI erreichen ihn dort.

const win = window.open('https://latex.giit.ch/?embed=window&lang=de', 'latexeditor-17');

Die KI direkt an deinen Server liefern lassen

Gib dem Editor deine Regeln, eine https-Adresse auf deiner Website und einen Schlüssel für diese Editor-Sitzung. «Prompt kopieren» sagt der KI dann, ihr Ergebnis dorthin zu senden; deine Seite öffnet es im Editor. Halte den Schlüssel nur gültig, solange der Editor offen ist.

ed.contentWindow.postMessage({ type: 'latexeditor:load', name: 'Offerte', content: meinText,
  ai: { label: 'Meine Verwaltung', prompt: 'Keep the placeholders.',
        endpoint: 'https://deine-seite.ch/api/ki-ergebnis', key: sitzungsSchluessel } }, ED);

Alle Nachrichten

RichtungNachrichtBedeutung
Editor → SeitereadyDer Editor kann ein Dokument aufnehmen.
Seite → Editorload {name, content, assets?, context?, hook?, ai?}Dein Dokument öffnen (mit Bildern, wo das Format sie hat).
Editor → Seiteloaded {id, name}Dein Dokument ist offen; merke dir die id.
Editor → Seitechange {id, name, content}Eine echte Änderung (nicht das Laden).
Editor → Seitesave {id, name, content, assets, updated}Speichern / Ctrl+S, oder die Antwort auf get.
Seite → Editorget · saveDen aktuellen Stand holen · Speichern drücken.
Editor → Seiteclosing {id, name, content}Das eigene Fenster geht mit ungespeicherten Änderungen zu.
Editor → Seitereload {id, unsaved}F5 / Ctrl+R in deiner Seite - du entscheidest.
Seite → Editorai {label, prompt, endpoint, key} · ai {clear}KI über deinen Server, ein Schlüssel je Sitzung.
Editor → Seitekey-request {reason: "missing"}Die Sitzung hat noch keinen Schlüssel.

Die vollständige Beschreibung mit Webhook und allen Feldern steht in der llms.txt jedes Editors und in llms-full.txt.

Fragen

Sind die Editoren wirklich kostenlos?

Ja. Ohne Anmeldung, ohne Werbung, ohne Grenze bei der Zahl der Dokumente.

Wird mein Dokument irgendwo hochgeladen?

Nein. Die Editoren laufen in deinem Browser und speichern die Dokumente dort. Nur wenn du einen Webhook einrichtest (oder eine Website den Editor einbindet), geht eine gespeicherte Fassung an diesen Server.

Welche KI kann ich nutzen?

Jede - ChatGPT, Claude, Gemini, Copilot oder die KI in deinem Programmierwerkzeug. Prompt kopieren, sagen, was du willst, und den Link anklicken, mit dem die KI antwortet.

Kann ich einen Editor in meiner Website verwenden?

Ja. Als iframe einbinden oder im eigenen Fenster öffnen und Dokumente per postMessage austauschen, oder gespeicherte Fassungen per Webhook an deinen Server schicken lassen.

Wie bekomme ich die deutsche Oberfläche?

?lang=de an die Adresse hängen. Der Editor merkt es sich; ?lang=en schaltet zurück. Der Prompt für die KI bleibt englisch.

Wer macht die Editoren?

Grünwald Innovation in Neuhausen am Rheinfall, Schweiz.