giit Editors

ライブプレビュー付きの無料オンラインエディター - プライベート、AI 対応、埋め込み可能

毎日使うフォーマットのためのブラウザーエディター群です。左にコード、右に結果、アップロードは一切ありません。どの AI もリンクでエディターに書き込め、どのエディターも自分の Web サイトに組み込めます。

  • 登録不要、広告なし
  • ファイルはブラウザー内に保存
  • どの AI も書き込める
  • Web サイトに埋め込める
  • 14 言語に対応

エディター一覧

各エディターはそれぞれのフォーマット専用に作られ、どれも同じように使えます。

  • LaTeX Editor

    latex.giit.ch

    LaTeX を書くと、入力に合わせて組版されたページが表示されます。画像、ドキュメント設定、PDF エクスポート。

    ● 公開中
  • SVG Editor

    svg.giit.ch

    SVG をコードとキャンバスで: 図形の移動、サイズ変更、色変更、スナップグリッド、PNG、JPG、WebP、React へのエクスポート。

    ● 公開中
  • HTML Editor

    html.giit.ch

    ページのライブプレビュー付きの HTML。画像はファイルとして保管、プレビューで直接テキストを編集、1 ファイルまたは ZIP でエクスポート。

    ● 公開中
  • Markdown Editor

    md.giit.ch

    表、タスクリスト、脚注、数式に対応した Markdown。読みやすいプレビューと HTML や PDF へのエクスポート。

    ● 公開中
  • JSON Editor

    json.giit.ch

    JSON と JSON Lines をコードと折りたためるツリーで: ツリーでキーと値を編集、JSON Schema で検証、YAML、CSV、XML に変換。

    ● 公開中
  • YAML Editor

    yaml.giit.ch

    同じデータツリー付きの YAML。コメントとアンカーを保持し、問題を行付きで表示、JSON に変換。

    ● 公開中
  • XML Editor

    xml.giit.ch

    要素ツリー、XPath 検索、整形式チェック、JSON や YAML への変換を備えた XML。

    ● 公開中
  • CSV Editor

    csv.giit.ch

    CSV をテキストと表計算ソフトのような表で。大きなファイルにも対応し、XLSX、JSON、Markdown や HTML の表にエクスポート。

    ● 公開中
  • SHLS Editor

    shls.giit.ch

    AI 向けのトークン効率の良いリスト形式 SHLS: キーブロックとレコードをツリーで、問題を行付きで表示、リファレンスのコーデックとまったく同じ JSON との相互変換。

    ● 公開中
  • Typst Editor

    typst.giit.ch

    本物のコンパイラーがブラウザーで動く Typst: 入力に合わせてページを表示、選択できるテキスト付きの PDF、ドキュメントと一緒に保存される画像。

    ● 公開中

すべてのエディターに共通の機能

1 つ覚えれば、すべて使えます。

設計からプライベート

エディターは静的なページです。ドキュメントはブラウザー内 (ローカルストレージ) に残り、自分でサーバーを設定しない限り、どこにも送信されません。

マイドキュメント

ドキュメントをいくつでもブラウザー内に保管できます。開く、名前の変更、複製、ダウンロード、削除ができ、それぞれに元に戻す履歴があります。

どの AI とも一緒に書ける

「AI アシスタント」→「プロンプトをコピー」で、ChatGPT、Claude、Gemini、Copilot に必要な情報がすべて渡ります。AI は結果をエディターで開くリンクで回答し、「元に戻す」で取り消せます。

ブラウザーエージェント (WebMCP)

WebMCP 対応のブラウザーでは、AI エージェントが開いているドキュメントを直接読み書きするツールを使えます。変更はすべて元に戻せる 1 ステップです。

AI の状態がひと目でわかる

AI ボタンの点で、AI が接続されているか (Web サイト経由、ブラウザーエージェント、このタブのリンク) がわかります。

プレビューで編集

プレビューのテキストをクリックしてその場で変更すると、コードも追従します。それ以外の場所をクリックするとコードへ移動します。

自分のサーバーに保存

Webhook が保存した版をすべて、指定したアドレスにトークン付きで送ります。自動でも、Ctrl+S でも送れます。

14 言語に対応

どのエディターにも英語、ドイツ語、フランス語、イタリア語、スペイン語、ポルトガル語、オランダ語、ポーランド語、トルコ語、ロシア語、ウクライナ語、中国語、日本語、韓国語のページがあります (/de/、/fr/ …)。言語メニューで切り替えられ、選択は記憶されます。AI へのプロンプトは常に英語のままです。

ライト、ダーク、自動

どのエディターもシステム設定または選んだテーマに従い、スマートフォンやタブレットでも使えます。

エディターを自分の Web サイトで使う

すべてのエディターは同じプロトコルを使います。latex を svg、html、md、json、yaml、xml、csv、typst に置き換えても、メッセージは同じで、接頭辞だけが変わります (latexeditor:、svgeditor: …)。

エディターをページに入れる

iframe だけで十分です。?embed=1 で保存ボタン付きの簡易表示になり、ページに独自の保存ボタンがある場合は ?save=0 で隠せます。アドレスで言語を選びます: ドイツ語は /de/、フランス語は /fr/ などです。

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

ドキュメントを読み込み、変更と保存を受け取る

エディターが準備完了を知らせ、ページがドキュメントを送り、エディターは実際の編集と保存のたびに報告します。すべてのメッセージの送信元 (origin) を確認してください。

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: 'Offer', content: myText }, ED);
  if (m.type === 'latexeditor:change') markUnsaved();
  if (m.type === 'latexeditor:save') saveOnYourServer(m.content, m.assets);
});

または専用のウィンドウで開く

専用のウィンドウで開いた完全なエディターは、window.opener とまったく同じようにやり取りし、AI からのリンクもそこに届きます。

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

AI から直接自分のサーバーに届ける

エディターにルール、自分のサイト上の https アドレス、このエディターセッション用のキーを 1 つ渡します。すると「プロンプトをコピー」が AI に結果をそこへ POST するよう伝え、ページがそれをエディターで開きます。キーはエディターを開いている間だけ有効にしてください。

ed.contentWindow.postMessage({ type: 'latexeditor:load', name: 'Offer', content: myText,
  ai: { label: 'My Admin', prompt: 'Keep the placeholders.',
        endpoint: 'https://your-site.com/api/ai-result', key: sessionKey } }, ED);

すべてのメッセージ

方向メッセージ意味
エディター → ページreadyエディターがドキュメントを受け取れる状態です。
ページ → エディターload {name, content, assets?, context?, hook?, ai?}ドキュメントを開きます (フォーマットが対応していれば画像も)。
エディター → ページloaded {id, name}ドキュメントが開きました。id を覚えておいてください。
エディター → ページchange {id, name, content}実際の編集 (読み込みではない)。
エディター → ページsave {id, name, content, assets, updated}保存 / Ctrl+S、または get への応答。
ページ → エディターget · save現在の状態を要求 · 保存ボタンを押す。
エディター → ページclosing {id, name, content}専用のウィンドウが未保存の変更を残して閉じます。
エディター → ページreload {id, unsaved}ページ内での F5 / Ctrl+R。どうするかはページが決めます。
ページ → エディターai {label, prompt, endpoint, key} · ai {clear}サーバー経由の AI、セッションごとにキー 1 つ。
エディター → ページkey-request {reason: "missing"}セッションにまだキーがありません。

Webhook とすべてのフィールドを含む完全な説明は、各エディターの llms.txt と次の場所にあります: llms-full.txt.

よくある質問

エディターは本当に無料ですか?

はい。登録も広告もなく、ドキュメント数の制限もありません。

ドキュメントはどこかにアップロードされますか?

いいえ。エディターはブラウザー内で動作し、ドキュメントはブラウザーの保存領域に保管されます。Webhook を設定した場合 (または Web サイトがエディターを埋め込んでいる場合) にだけ、保存した版がそのサーバーに送られます。

どの AI を使えますか?

どの AI でも使えます。ChatGPT、Claude、Gemini、Copilot、またはコーディングツールの AI です。プロンプトをコピーして希望を伝え、AI が回答したリンクをクリックしてください。

エディターを自分の Web サイトで使えますか?

はい。iframe で埋め込むか専用のウィンドウで開いて postMessage でドキュメントをやり取りするか、Webhook で保存した版を自分のサーバーに送れます。

エディターを自分の言語で使うには?

上部の言語メニューで選ぶか、そのページを直接開いてください: ドイツ語は /de/、フランス語は /fr/、日本語は /ja/ などです。エディターは選択を記憶します。AI へのプロンプトは英語のままです。

エディターを作っているのは?

スイス、ノイハウゼン・アム・ラインファルの Grünwald Innovation です。