Markdown Live Editorの選び方｜VS Code拡張と無料ツールを比較

「Markdown Live Editor」という言葉には、2つの意味があります。ひとつは書きながら表示を確認できるエディタ全般の呼び方、もうひとつは2026年に公開された同名のVS Code拡張機能です。前者を探しているならVS Codeの標準機能で足りることが多く、後者を探しているなら記法を隠したまま編集できる別物の道具になります。この記事では両方を区別したうえで、VS Code標準・同名拡張・ブラウザ型・チーム共同編集の使い分けを、保存先とメンテナンス状況という実務で効く軸から整理します。あわせて2026年6月に公開されたMarkdown Preview Enhancedの脆弱性4件と、その確認手順も扱います。

まとめ：用途別に見たMarkdown Live Editorの結論

結論を先に示します。VS Codeを日常的に開いているなら、Ctrl+K V（macOSは⌘K V）で横並びプレビューが開くため、まず新しい道具を入れる必要はありません。記法そのものを画面から消したいなら同名拡張、ブラウザで済ませたいなら保存先の有無で選び、チームで同時に書くならHackMDかHedgeDocに絞られます。

逆に、更新が止まったツールへ新規のドキュメント資産を預ける判断は避けたほうが無難です。該当するものは後の章で名指しします。

拡張なしで動くVS Codeの標準ライブプレビュー

「vscode markdown live editor」で検索する人が最初に知るべきなのは、VS Codeでは拡張機能を入れる前からプレビューが動くという事実です。旧来の解説記事は拡張の導入手順から始まりますが、2026年時点では手順の大半が不要になっています。

標準プレビューのショートカットと2026年時点の対応範囲

プレビューを開くショートカットは2種類あります。Ctrl+Shift+V（macOSは⇧⌘V）で単独表示、Ctrl+K V（macOSは⌘K V）で編集画面と横並びの表示になります。書きながら確認する用途で使うのは後者です。

標準プレビューは数式にも対応しており、公式ドキュメントは「VS Code’s built-in Markdown preview renders math equations using KaTeX」と明記しています。$x^2$のようにドル記号1つで囲めばインライン数式、2つで囲めば数式ブロックとして描画されます。無効化したい場合のみmarkdown.math.enabledをfalseにします。

図についても状況が変わりました。VS Code 1.121（2026年5月20日公開）で、Matt Bierner氏の拡張「Markdown Preview Mermaid Support」が本体に統合され、Mermaid Markdown Featuresという組み込み拡張になっています。これによりMermaidの図はMarkdownプレビュー、ノートブックのMarkdownセル、チャットの3か所で描画されます。注意点は統合の副作用で、旧拡張bierner.markdown-mermaidを入れたままだと描画が競合し、図が出なくなる不具合が報告されています（microsoft/vscode Issue #317870）。1.121以降で図が消えたら、まず旧拡張をアンインストールしてください。Mermaidの記法そのものはMermaid記法の使い方を完全ガイド｜無料のLive Editorでフローチャート・シーケンス図を作成に、VS Codeでの図作成と画像出力はVSCodeでMermaidを使う方法｜記法・図作成・画像出力とAI拡張mermAIdにまとめています。

同名拡張「Markdown Live Editor」が標準プレビューと違う点

紛らわしいことに、Visual Studio Marketplaceにはそのものずばり「Markdown Live Editor」という名前の拡張機能が存在します。開発者はJun Ishii氏、拡張IDはjishii1204.markdown-live-editorで、初回公開は2026年2月21日、最新版0.6.4が2026年7月2日に更新されています。インストール数は約1万4千件で、窓の杜が2026年4月2日にレビュー記事を掲載しています。ライセンスはMITです。

標準プレビューとの違いは、画面の分け方そのものです。標準プレビューが「左に記法・右に結果」の2画面なのに対し、この拡張はMilkdownというライブラリを使い、記法を画面に出さずに整形後の見た目のまま直接編集します。見出しは見出しとして、表は表として表示され、編集内容はソースファイルと双方向に同期されます。GFMの表・タスクリスト・取り消し線・脚注に加え、GitHubスタイルのアラート、絵文字ショートコード、Mermaid、KaTeXにも対応します。

選ぶ基準は、記法を見たいかどうかです。差分レビューやGit運用でMarkdownのソースを直接読む前提の作業では、記法が見えないことがかえって邪魔になります。逆に、仕様書や設計書のように「文書として読める状態」で書き進めたい場面、あるいはMarkdown記法に不慣れなメンバーが編集に参加する場面では、この拡張の効果がはっきり出ます。標準プレビューと排他ではないため、両方入れて文書の性質で開き方を変える運用も取れます。

Markdownの用途が文書ではなく発表資料なら、エディタではなくスライド生成側の道具が候補に入ります。slides.md 1枚をスライドへ変換し、PDFやPPTXへ書き出せるSlidevの手順はSlidevとは？Markdownでスライドを作る手順とPDF出力・公開までの実装ガイド【2026年版】にまとめました。

同期スクロールとプレビュー非表示を直すsettings.jsonの設定

横並びプレビューで最も多いつまずきは、編集画面をスクロールしてもプレビューが追従しない状態です。追従は2方向それぞれに設定があり、片方だけ無効になっている場合があります。次の記述で両方向を有効に戻せます。

{
  "markdown.preview.scrollPreviewWithEditor": true,
  "markdown.preview.scrollEditorWithPreview": true,
  "markdown.math.enabled": true
}

プレビュー自体が開かない場合は、settings.jsonの構文エラーを疑います。末尾のカンマや閉じ括弧の欠落があるとVS Codeは設定ファイル全体を読み飛ばすため、プレビュー関連の設定だけでなく他の設定も同時に効かなくなります。設定画面右上のアイコンからsettings.jsonを開き、赤い波線が出ていないか確認するのが早い切り分けです。図が出ない症状に絞った対処はVSCodeでシーケンス図・フローチャート自動生成｜Mermaidが表示されない対処で扱っています。

Markdown All in Oneで足せる機能とPDF出力の制約

標準プレビューで足りないのは、目次の自動生成や見出しレベルの一括操作といった編集支援です。ここを埋めるのがMarkdown All in Oneで、コマンドパレットの「Create Table of Contents」で目次を挿入でき、既定ではファイル保存のたびに目次が自動更新されます（markdown.extension.toc.updateOnSaveで無効化可能）。

誤解が多いのがPDF出力です。この拡張が持つのは「Markdown All in One: Print current document to HTML」および複数ファイルを一括処理する「Print documents to HTML」であり、PDFを直接書き出すコマンドはありません。公式READMEも、共有用にPDFが要る場合は出力したHTMLをChromeなどのブラウザから印刷する手順を推奨しています。PDFを日常的に配布する運用なら、この一手間を前提に組むか、PDF出力を持つDillinger側に寄せる判断になります。

Markdown拡張の安全性：2026年6月に公開されたCVE4件

ライブプレビューは「Markdownを解釈して描画する」処理であり、受け取ったファイルの内容を実行系に渡す経路を持ちます。この構造上のリスクが2026年に具体化しました。ドキュメントの受け渡しが多いチームほど、この章の確認は先送りしないでください。

Markdown Preview Enhanced 0.8.28未満に残る脆弱性

2026年6月5日、Markdown Preview Enhanced（MPE）に対して4件のセキュリティアドバイザリが公開されました。いずれもGitHub Security Advisory Databaseに登録済みです。

共通するのは、細工したMarkdownファイルを開いてプレビューするだけで任意のコードが動きうる点です。GitHubからクローンしたリポジトリのREADMEや、社外から受け取った仕様書をそのままプレビューする作業は日常的に発生するため、影響を受ける場面は珍しくありません。修正版は同日公開の0.8.28で、その後も更新が続き、2026年8月31日に0.8.32が出ています。0.8.28以降であれば上記4件の対象外です。

なお、同じくVS Code向けのMarkdown All in Oneについては、2026年9月1日時点でGitHub Security Advisory Databaseに該当する登録がありません。「安全である」と断定はできませんが、少なくとも公表済みの既知脆弱性を抱えた状態ではありません。

導入済み拡張の版を一括確認するコマンド

自動更新を有効にしていれば通常は修正版へ上がっていますが、オフライン環境や更新を止めた端末では古い版が残ります。次のコマンドで、インストール済み拡張とそのバージョンを一覧できます。

code --list-extensions --show-versions | grep markdown

出力に[email protected]のように0.8.28より小さい版が出たら更新対象です。この機会に、使っていないMarkdown系拡張を消しておく判断も有効です。前章のMermaidのように本体機能へ吸収された拡張は、残しておくと保守対象が増えるだけでなく、標準機能の動作を壊す側に回ります。

ブラウザ型Markdown Live Editorの現況と保存先の違い

ブラウザ型は「保存できるか」で性格が大きく変わります。保存しない前提のツールは軽く、ログインも不要ですが、書きかけの原稿を置く場所にはなりません。ここを取り違えると、タブを閉じた瞬間に原稿を失います。

Markdown Live PreviewとDillingerの機能差

Markdown Live Preview（markdownlivepreview.com）は、開発元のリポジトリtanabe/markdown-live-previewが自ら「a tiny web tool to preview Markdown formatted text」と説明するとおり、貼り付けた記法の見え方を確認するための最小構成のツールです。リポジトリは2026年8月9日に更新されており、放置状態ではありません。アカウント登録もクラウド保存もないため、他人のREADMEの記法を確認する、社内Wikiに貼る前に表崩れを見る、といった単発の用途に向きます。

一方のDillingerは、GitHub・Dropbox・Google Drive・OneDrive・Bitbucketへの接続を持ち、書いたものをMarkdown・スタイル付きHTML・PDFの3形式で書き出せます。リポジトリの最終更新は2026年6月21日です。クラウド保存とPDF出力が要るならこちらですが、外部サービスに認証情報を渡す構成になるため、社外秘の原稿を扱う環境では接続先を限定する運用が要ります。

StackEditとEditor.mdを選ぶ前に確認したい更新状況

比較記事で定番として並びがちなこの2つは、開発状況が判断材料になります。StackEditはGoogle Drive・Dropbox・GitHubへの同期に加え、Blogger・WordPress・Zendeskへの投稿機能を持つ多機能なエディタですが、GitHubリポジトリの最終更新は2023年7月4日、サイトの著作権表示も「Copyright 2013-2019」のままです。サービス自体は動いていても、記法の新仕様やセキュリティ修正が今後入る保証はありません。

Editor.mdはさらに差が開きます。最新リリースはv1.5.0で、公開日は2015年6月9日です。11年間リリースがないコンポーネントを新規プロダクトに組み込む判断は、CommonMarkやGFMの仕様追随を自前で背負うことを意味します。既存システムで動いているものを置き換える必要はありませんが、これから選ぶ対象からは外して構いません。

チーム共同編集：HackMD無料枠とHedgeDocセルフホストの分岐点

複数人が同じ文書を同時に編集する要件が入ると、選択肢はSaaSのHackMDか、そのオープンソース系譜であるHedgeDocのセルフホストにほぼ絞られます。判断軸は機能差よりも、無料枠の制限とデータの置き場所です。

HackMD無料プランで先に当たる制限

HackMDの無料プランはノート数が無制限で、少人数の試用には十分です。ただし公式の料金ページが示す制限のうち、実務で先に効いてくるのは次の4つです。

• 共同編集の招待は3名まで
• 版履歴は直近10版まで
• 画像アップロードは1枚あたり1MBまで
• GitHubへのプッシュは月20回、API呼び出しは月400回まで

削除したノートのゴミ箱保持は3日間です。仕様書のレビューで版を遡る運用や、スクリーンショットを多用する手順書では、履歴10版と1MB制限のどちらかに早い段階で当たります。5名以上のチームで常用するなら、無料枠での検証は「使い勝手の確認まで」と割り切るのが現実的です。

HedgeDocをセルフホストする判断条件

HedgeDocは自社サーバーで動かす前提のオープンソース版です。バージョン1.12.0が2026年8月21日に公開されており、開発は継続しています。選ぶ理由になるのは、原稿を外部SaaSに置けない規程がある場合と、招待人数や履歴の制限を課金ではなくインフラ側で解決したい場合です。

逆に、セルフホストを選ぶべきでない条件も明確です。運用担当が実質1名で、バックアップ・アップグレード・TLS証明書更新を継続的に回す体制がないなら、HackMDの有料プランのほうが総コストは下がります。ドキュメント基盤はサービス停止が直接業務を止めるため、「安く上がる」だけを理由に自前運用へ倒す判断は失敗しやすい部類です。

.mdファイルの開き方と表示崩れの切り分け

Markdown Live Editorを探す層には、そもそも受け取った.mdファイルをどう開くかで止まっている人も含まれます。ここは道具の問題ではなく関連付けの問題です。

拡張子.mdを既定のエディタで開く設定

Windowsでは.mdファイルを右クリックし、「プログラムから開く」から「別のプログラムを選択」でVS Codeを指定し、既定として設定します。macOSではFinderでファイルを選び、情報ウインドウの「このアプリケーションで開く」でVS Codeを選んで「すべてを変更」を押します。関連付けが済めば、以降はダブルクリックで開いてCtrl+K Vを押すだけで整形後の見た目を確認できます。ツールを入れずに中身だけ見たい場合は、前述のMarkdown Live Previewに貼り付ける方法でも足ります。

表・改行・画像パスが崩れる典型パターン

プレビューで崩れるとき、原因はほぼ次のどれかに収まります。表が1行の文字列として表示される場合は、ヘッダー行の直下にある区切り行の列数が本体行と一致していません。改行が反映されない場合は、GFMでは行末に半角スペース2つを置くか空行で段落を分ける必要があり、エディタの設定で末尾の空白を自動削除していると前者が消えます。画像が表示されない場合は、相対パスの基準がMarkdownファイルの位置であることを確認してください。

環境をまたぐと崩れる場合は、記法の解釈そのものが違っている可能性があります。GitHubのREADMEでは動くがVS Codeで崩れる、という症状はGFM独自記法を使っているときに起きます。Markdownを最終的にWebサイトとして公開する構成についてはMarkdownでWebサイトを作る3つの方法【2026年版】で扱っています。既存のWordやPDFをMarkdownへ移す場合はMarkItDown（マークイットダウン）とは｜各種ファイルをMarkdownに変換するMicrosoft製Pythonツールが参考になります。

よくある質問

Markdown Live Editorという名前のVS Code拡張がありますが、この記事の内容とは別物ですか？

別物として扱っています。jishii1204.markdown-live-editorは記法を画面に出さずに編集するWYSIWYG拡張で、2026年2月21日公開・最新版0.6.4です。一方で「Markdown Live Editor」はライブプレビュー対応エディタ全般の呼び方としても使われるため、この記事では両方を扱っています。

Markdown Live Editorで無料で使えるものはありますか？

あります。上記のVS Code拡張はMITライセンスで無料、ブラウザ型ではMarkdown Live PreviewとDillingerが無料で使え、HackMDにも無料プランがあります。VS Codeの標準プレビューも追加費用なしで、拡張機能のインストールすら不要です。

VS CodeでMarkdownのライブプレビューを出すショートカットは何ですか？

編集画面と横並びで開くのはCtrl+K V、macOSでは⌘K Vです。プレビューだけを単独で開く場合はCtrl+Shift+V（macOSは⇧⌘V）を使います。

Markdown Preview Enhancedは使っても安全ですか？

0.8.28以降へ更新してあれば、2026年6月5日に公開された4件のCVE（CVE-2026-50733、CVE-2026-49492、CVE-2026-49493、CVE-2026-11422）の対象外です。それより前の版を使い続けている場合は、細工されたMarkdownを開くだけでコードが実行されうるため、更新を優先してください。

Markdown All in OneとMarkdown Preview Enhancedはどちらを選ぶべきですか？

目的が違うため、必要な機能で選びます。目次の自動生成やショートカットによる編集支援が欲しいならMarkdown All in One、PlantUMLやWaveDromを含む多様な図・出力形式を扱うならMarkdown Preview Enhancedです。プレビュー表示だけが目的なら、どちらも入れずに標準機能で足ります。

StackEditは今も使えますか？

サービス自体は稼働していますが、GitHubリポジトリの最終更新は2023年7月4日で、サイトの著作権表示も2019年で止まっています。既存の使い方を続ける分には支障が出にくい一方、新しく長期運用する基盤として選ぶ判断はおすすめしません。

関連記事

• VSCodeでMermaidを使う方法｜記法・図作成・画像出力とAI拡張mermAId
• Mermaid記法の使い方を完全ガイド｜無料のLive Editorでフローチャート・シーケンス図を作成
• VSCodeでシーケンス図・フローチャート自動生成｜Mermaidが表示されない対処
• MarkdownでWebサイトを作る3つの方法【2026年版】
• MarkItDown（マークイットダウン）とは｜各種ファイルをMarkdownに変換するMicrosoft製Pythonツール