Skip to content
Markdownプレビュー
Tools

Markdownプレビュー

新着

Markdownを書きながら、レンダリング結果を横に並べて確認。

0 words
Export ▾

Runs entirely in your browser. Nothing is uploaded.

Mermaid・LaTeX対応の無料オンラインMarkdownプレビュー&エディター

このMarkdownプレビューは、入力と同時にテキストをリアルタイムで左右並べて描画します。左側のエディターで書くと、フォーマット済みの結果が即座に右側に表示されます — 見出し・太字・斜体・表・タスクリスト・コードブロック・Mermaidダイアグラム・KaTeX数式、すべて入力しながら描画。完全無料のオンラインMarkdownエディターMarkdownビューアがひとつになったツールで、登録不要・制限なし・インストール不要です。

すべてブラウザー内で動作するため、真のプライバシーも保たれます。テキストはローカルで解析され、デバイスに自動保存されます。サーバーへのアップロードは一切ありません。StackEditHackMDDillinger.ioなどのクラウドエディターより高速でプライベートです。ページ読み込み後はオフラインでも動作します。

期待どおりに描画されるGitHub-Flavored Markdown

プレビューアーはGitHub-Flavored Markdown(GFM)を完全サポートしています。テーブル・タスクリスト・取り消し線・自動リンク・シンタックスハイライト付きコードブロックがGitHub READMEとまったく同じように描画されます。パイプテーブルや- [x]チェックリストを書くと、右側にフォーマットされて表示されます。ドキュメントを書く人に信頼できるGitHub READMEプレビューです。

フォーマットツールバーでワンクリックで太字・斜体・取り消し線・インラインコード・見出し・リスト・引用・リンク・画像・テーブル・コードブロックを挿入できます。キーボードショートカット(Ctrl+B・Ctrl+I・Ctrl+K・Ctrl+F)はデスクトップエディターと同様に機能します。ライブの単語数・文字数・読書時間カウント、自動生成目次、検索と置換。

Mermaidダイアグラム・LaTeX数式・シンタックスハイライトコード

ここが基本的なプレビューアーを超えるところです。```mermaidブロックを追加すると、フローチャート・シーケンス・クラス・ガント・円グラフがライトモードとダークモードに適応するSVGとしてリアルタイム描画されます。VS Codeの組み込みプレビューでこれを行うには「Markdown Preview Mermaid Support」拡張機能が必要です。Dillinger.ioと基本的なMarked.jsデモはMermaidをまったくサポートしていません。

インラインで$E = mc^2$、またはブロックで$$\int_0^\infty e^{-x^2} dx$$と書くと、LaTeX数式がKaTeXで即座に組版されます。コードブロックはhighlight.jsで180以上のプログラミング言語をカラーリングします。

VS Code・Typora・Dillinger・StackEdit・Obsidianのインストール不要の代替ツール

普段VS CodeのMarkdownプレビュー(Ctrl+Shift+V)や横並び分割ビュー(Ctrl+K V)を使っているなら、このページはエディターを開かずに同じことができます。Typoraは独自のシームレス編集モードを持ちますが$14.99の有料ソフトです — このツールは無料でインストール不要です。

StackEditはKaTeXとMermaidをサポートしますが、クラウド同期アカウントが必要です。HackMDはドキュメントを自社サーバーに保存します。Obsidianはインストールが必要なアプリです。このツールは、Mermaid + KaTeX + GFM + エクスポートを、完全なプライバシーを保ちながら1つの即時ロードページで提供します。

PDF・HTML・Markdownへのエクスポート — URLで共有

ドキュメントが完成したら、どこへでも持ち出せます。PDFエクスポートは描画されたページ(Mermaidダイアグラム・KaTeX数式・ハイライトコード込み)をファイルに印刷します。.htmlのダウンロードはインラインスタイル付きのスタンドアロンWebページを保存します。.mdのダウンロードはソースコードを保持します。きれいな描画済みHTMLやリッチテキストをコピーして、Gmail・Googleドキュメント・Notionに貼り付けることもできます。

誰かに送る必要がありますか?共有はドキュメント全体をリンクにエンコード(LZ-stringで圧縮)し、URLをクリップボードにコピーします。そのリンクを開くとテキストがエディターに直接読み込まれます — アカウント不要・サーバー不要・アップロード不要。

安全な出力・自動保存・完全なプライバシー

外部ソースからMarkdownをプレビューすることにリスクがあってはなりません。解析後、このツールはDOMPurifyで描画されたHTMLをサニタイズし、scriptタグ・インラインイベントハンドラー・javascript: URLを削除してから表示します。プレビューはコンテンツを忠実に表示しながらXSSに対して安全です。

入力した瞬間にすべてが更新されます。下書きはローカルストレージに自動保存されるので、タブを閉じても作業は失われません。登録不要・アップロード不要・トラッキングなし。ドキュメント作成・READMEプレビュー・Mermaidと数式の描画・MarkdownからHTMLやPDFへの変換 — このライブMarkdownプレビューが1つの高速でプライベートなページですべてを行います。

Frequently asked questions

このMarkdownエディター&プレビューアーは無料ですか?

はい — 登録なし・アカウントなし・利用制限なしで完全無料です。ワンクリックで開き、ブラウザー内で完全に動作します。Dillinger.io(広告あり)・StackEdit(クラウド同期あり)・HackMD(ほとんどの機能にアカウント必要)と異なり、ファイルサイズ制限も有料機能もありません。

Markdownコンテンツはプライベートですか?

はい、完全に。MarkdownはブラウザーでリアルタイムにパースされレンダリングされHtmlが、デバイスのローカルストレージに自動保存されます。サーバーへのアップロードは一切ありません。ページ読み込み後はオフラインで動作します。

GitHub-Flavored Markdown(GFM)をサポートしていますか?

はい。プレビューアーはGFMを完全サポートしています — 整列付きパイプテーブル・チェックボックス付きタスクリスト(- [x]と- [ ])・~~ダブルチルダ~~の取り消し線・シンタックスハイライト付きコードブロック・自動リンク・HTMLタグ。

Mermaidダイアグラムを描画できますか?

できます。```mermaidコードブロック内にダイアグラムを置くと、プレビューパネルでSVGとしてリアルタイム描画されます。サポートされているダイアグラムタイプ:フローチャート・シーケンス図・クラス図・状態図・ER図・円グラフ・ガントチャート・Gitグラフ。

LaTeX数式を描画できますか?

できます。$E = mc^2$のようなインライン数式と$$…$$区切りのブロック数式はKaTeXで描画されます。KaTeXは高速(ネットワークリクエストなし・ローカル動作)で、LaTeX数学記法の大部分をカバーしています。

コードブロックはシンタックスハイライトされますか?

されます。コードブロックはhighlight.jsで180以上のプログラミング言語をハイライトします。開始フェンスの後に言語ヒントを追加 — 例えば```js・```python・```sql — すると適切なカラーテーマが適用されます。

VS CodeなしでどうやってMarkdownをプレビューしますか?

左側のエディターにMarkdownを貼り付けるか入力するだけで、描画済みの結果が即座に右側に表示されます — Visual Studio Codeも・拡張機能も・インストールも不要です。

VS CodeでMarkdownをプレビューするにはどうすればいいですか?

VS Codeで.mdファイルを開き、Ctrl+Shift+V(macOSではCmd+Shift+V)で新しいタブにMarkdownプレビューを開くか、Ctrl+K → Vで横並び表示にします。VS Codeの組み込みプレビューはCommonMarkとGFMをサポートしますが、拡張機能なしではMermaidダイアグラムやKaTeX数式を描画できません。

Dillinger.ioとの比較は?

Dillinger.ioはクラウド同期機能を持つ優れたオンラインMarkdownエディターです。しかし、Mermaidダイアグラム・KaTeX数式・安全なHTMLサニタイズをサポートしていません。広告サポート型でもあります。このツールはMermaid・LaTeX/KaTeX・DOMPurifyサニタイズ・URLベースの共有・オフライン能力を追加しています。

StackEditとの比較は?

StackEditはKaTeXとMermaidを持つ強力なMarkdownエディターです。主なトレードオフは、Google/GitHubアカウントが必要でドキュメントをクラウドに保存し、インターフェースがより複雑なことです。このツールはシンプルさとプライバシーを優先します。

HackMDとの比較は?

HackMDはチーム向けの強力なMarkdown共同作業プラットフォームです。しかし、すべてのドキュメントを自社サーバーに保存し(無料ドキュメントはデフォルトで公開アクセス可能)、アカウント登録が必要です。このツールはURLによる迅速でプライベートな共有が可能な個人利用向けです。

Typoraとの比較は?

Typoraは独自のシームレス編集モードを持つ有料デスクトップMarkdownエディター($14.99)です。このブラウザーベースのツールはインストール不要でどのOSでも動作し、購入も不要です。

ObsidianやNotionのMarkdownとの比較は?

Obsidianはインストールが必要で独自のMarkdownダイアレクトがあります。NotionはアカウントRequiredのブロックベースエディターを使用します。ブラウザーで手軽にMarkdownをプレビューするだけなら、どちらも理想的ではありません。

Marked.jsライブデモとの比較は?

Marked.jsデモはMermaid・KaTeX・シンタックスハイライト・ツールバー・エクスポート・共有のない基本的なリファレンス実装です。このツールはそれらすべての機能を備えた完全な執筆インターフェースを追加します。

MarkdownをPDFやHTMLにエクスポートできますか?

できます。エクスポート → PDF印刷/保存でダイアグラム・数式・ハイライトコードを含めたドキュメントをPDFに描画します。エクスポート → .htmlのダウンロードでインラインスタイル付きのスタンドアロンHTMLファイルを取得できます。

描画されたHTMLはXSSに対して安全ですか?

はい。解析後、生成されたHTMLはDOMPurifyでサニタイズされ、危険な構造 — <script>タグ・インラインイベントハンドラー・javascript: URL — が削除されます。信頼できないソースからのMarkdownでもプレビューは安全です。

アカウントなしでMarkdownドキュメントを共有できますか?

できます。共有をクリックすると、ツールはドキュメント全体をURL(LZ-string圧縮)にエンコードしてリンクをクリップボードにコピーします。そのリンクを開いた人のエディターにドキュメントが直接読み込まれます — サーバーなし・データベースなし・アカウント不要。

プレビューはエディターと同期スクロールしますか?

します。エディターとプレビューパネルは双方向の同期スクロールを備えています。フォーマットツールバーでワンクリックで太字・斜体・取り消し線・インラインコード・見出し・リスト・引用・リンク・画像・テーブル・コードブロックを挿入できます。

既存の.mdファイルを開けますか?

開けます。Openをクリック(またはファイルをエディターにドラッグ)すると、.md・.markdown・.txtファイルをエディターに直接読み込めます。ファイルはブラウザーによってローカルで読み取られます — アップロードは一切ありません。

どのMarkdown機能がサポートされていますか?

パーサーはCommonMarkとGFM拡張をサポートしています:見出し・強調・太字・取り消し線・水平線・引用・箇条書き・番号付きリスト・タスクリスト・パイプテーブル・ハイライト付きコードブロック・インラインコード・リンク・画像・生HTML。さらに:```mermaidブロック内のMermaidダイアグラム・KaTeXによる$…$と$$…$$のLaTeX数式・脚注。HTMLはDOMPurifyでサニタイズされます。