DevTools Japan トップへ

HTML⇔Markdown相互変換

HTMLとMarkdownを双方向で相互変換(ブラウザ内で完結)

変換の向き

左に入力すると右に変換結果が表示されます
HTML 入力
Markdown 出力
変換はすべてブラウザ内のJavaScriptで実行され、入力内容が外部へ送信されることはありません。見出し・太字・斜体・リンク・画像・リスト・コードブロック・引用・テーブルに対応した軽量コンバータです。複雑なレイアウトや独自属性は簡略化される場合があります。

HTML⇔Markdown相互変換ツールの使い方

HTMLをMarkdownに、あるいはMarkdownをHTMLに、双方向で相互変換できる無料ツールです。上部のトグルで変換の向きを切り替え、左側のエリアにソースを入力すると、右側に変換結果がリアルタイムで表示されます。すべての処理はお使いのブラウザ内で完結するため、インストールや会員登録は不要で、入力した内容が外部に送信されることもありません。

使い方はシンプルです。まず「HTML → Markdown」か「Markdown → HTML」のどちらかを選び、左のテキストエリアに変換したい内容を貼り付けます。右側に出た結果は「コピー」ボタンでワンクリックでコピーできます。「⇅ 結果を入力に入れ替え」を押すと、いまの出力を入力側に移動して逆方向の変換もすぐに試せます。「サンプルを読み込む」で記法の例を確認することもできます。

こんな場面に

ブログCMSやWebページ用にMarkdownの原稿をHTMLへ変換したいとき、逆にWebから取得したHTMLをREADMEやWiki用のMarkdownに整えたいとき、技術ドキュメントの記法を相互に変換したいときなどに便利です。エンジニアのドキュメント作成から、ライターの原稿整形まで幅広く活用できます。

対応している記法

本ツールは、一般的な文書で使われる主要な記法を軽量な独自コンバータでカバーしています。下記の記法について、双方向の変換に対応しています。

要素MarkdownHTML
見出し# 〜 ######<h1>〜<h6>
太字**太字**<strong>
斜体*斜体*<em>
リンク[文字](URL)<a href>
画像![alt](URL)<img>
リスト- 項目 / 1. 項目<ul> / <ol>
コードブロック```<pre><code>
引用> 引用<blockquote>
テーブル| 列 | 列 |<table>

変換の仕組みと注意点

Markdown→HTMLは行単位のパーサーでブロック(見出し・リスト・コードブロック・テーブルなど)を判定し、インライン記法(太字・斜体・リンク・画像・インラインコード)を変換します。HTML→Markdownはブラウザ標準のDOMParserでHTMLを構文解析し、要素を再帰的にたどってMarkdownへ書き戻します。いずれも外部ライブラリを使わないため軽量ですが、対応表にない独自タグや深いネスト、複雑なレイアウトは簡略化・省略される場合があります。重要な文書では変換後にプレビューで確認してください。

よくある質問

HTMLとMarkdownを両方向で変換できる?
はい。上部のトグルで「HTML → Markdown」と「Markdown → HTML」を切り替えられ、どちらの向きでも変換できます。左側にソースを入力すると右側に変換結果がリアルタイムで表示され、コピーボタンでワンクリックでコピーできます。入れ替えボタンを押すと、いま出力されている結果を入力側に移して逆方向の変換も試せます。
どの記法に対応している?
見出し(h1〜h6)、太字、斜体、リンク、画像、番号なし・番号付きリスト、コードブロック(フェンス)、インラインコード、引用(blockquote)、水平線、テーブルに対応しています。一般的な文書やドキュメント、READMEなどで使われる主要な記法を軽量な独自コンバータでカバーしています。
入力した内容は外部に送信される?
いいえ。変換処理はすべてお使いのブラウザ内(クライアントサイド)のJavaScriptだけで実行され、入力内容がサーバーや外部サービスに送信されることはありません。外部ライブラリの読み込みもなく、ネットワーク接続がない状態でもページが開いていれば動作します。社内文書や未公開の原稿も安心して変換できます。
複雑なHTMLも正しく変換できる?
本ツールは軽量な変換器のため、主要なタグを対象としています。ネストが深いリストや、divやspanによる複雑なレイアウト、独自の属性・スタイルは、Markdownに対応する記法がないため無視されたり簡略化されることがあります。ブログ記事や技術ドキュメントなど、構造化された標準的なHTMLで最も安定して動作します。
変換結果をそのまま使える?
はい。Markdown→HTMLの結果はそのままWebページやCMSに貼り付けて利用でき、HTML→Markdownの結果はREADMEやWiki、各種Markdown対応エディタに貼り付けて使えます。ただし用途によっては細かな調整が必要な場合があるため、重要な文書では変換後に一度プレビューで確認することをおすすめします。

関連ツール

JSON整形HTMLエンティティ変換Base64変換