Markdown エディター

左右に並んだライブプレビューで Markdown を書けます。GitHub Flavored Markdown の表とタスクリスト、無害化された HTML 出力、.md/.html のダウンロードに対応。

プレビュー
0 語 · 0 文字

marked で変換し DOMPurify で無害化しています。スクリプトやイベントハンドラーなど危険な HTML はプレビューと HTML 出力から除去されます。

関連ツール

すべて表示

Markdown エディターとは?

テキストの横にライブプレビューが表示されるオンラインの Markdown エディターです。GitHub Flavored Markdown(表、タスクリスト、取り消し線、自動リンク)に対応し、生成された HTML を表示して、HTML のコピーや、文書を .md または単体の .html ファイルとしてダウンロードできます。

Markdown エディターの使い方

  1. エディターに Markdown を書くか貼り付けます。構文を確認するにはサンプルを読み込むを押します。
  2. 入力に合わせてプレビューが更新されます。表示は、左右に並べる、エディターのみ、プレビューのみ、HTML から切り替えられます。
  3. 必要に応じて、GitHub Flavored Markdown(表、タスクリスト、取り消し線)と単一の改行を <br> として扱うを切り替えます。
  4. HTML をコピーするか、.md をダウンロード/.html をダウンロードを使います。

例

入力
# Hi

**bold** and <img src=x onerror=alert(1)>
出力
<h1>Hi</h1>
<p><strong>bold</strong> and <img src="x"></p>

onerror ハンドラーは DOMPurify によって削除されます

Markdown エディターを使うべき場面

README ファイル、ドキュメント、メモ、フォーラムの投稿、Markdown で書くメールの下書きや、Markdown をきれいな HTML に変換するのに使えます。特定のプラットフォーム固有の構文(GitHub のアラート、Mermaid の図、$…$ の数式、wiki リンク)は表示されません。

Markdown エディターの仕組み

Markdown は marked ライブラリで変換されます(CommonMark 互換で、有効にすると GFM の拡張が使われます。breaks オプションは、単一の改行を <br> に変えます)。生成された HTML は、HTML プロファイルを使った DOMPurify を通り、プレビューへの表示、コピー、ダウンロードの前に、<script>、onerror などのイベントハンドラー属性、javascript: の URL、その他の危険なマークアップが取り除かれます。どちらのライブラリも、ブラウザ内で必要になったときに読み込まれます。

一般的な使用例

  • ライブプレビュー付きで README.md を下書きする
  • Markdown のメモを Web サイトやメール用の HTML に変換する
  • GFM で表とタスクリストを書く
  • Markdown の構文を教えたり学んだりする
  • CMS やチャットの Markdown を投稿前にプレビューする

セキュリティ注意事項

プレビューと HTML の出力は DOMPurify で無害化されるため、信頼できない Markdown を貼り付けても、このページでスクリプトが実行されることはありません。Markdown がお使いのブラウザの外に出ることはありません。

よくある質問

Markdown 内の生の HTML は使えますか?

はい。ただし無害化されます。安全なタグは残り、スクリプト、イベントハンドラー、javascript: のリンクは削除されます。

文書は保存されますか?

いいえ。何も保存もアップロードもされません。作業内容を残すには .md ファイルをダウンロードしてください。

GitHub Flavored Markdown とは何ですか?

CommonMark に表、タスクリスト(- [x])、取り消し線(~~text~~)、自動リンクを追加した GitHub の拡張です。

おすすめの次のステップ

他のカテゴリを見る