HTML で書かれたコンテンツを Markdown に変換したい場面は意外と多くあります。WordPress の記事を Hugo や Astro に移行する、Notion のエクスポート HTML を整形する、Web ページの内容をメモとしてクリップする。こうした作業では HTML から Markdown への変換が必要になります。
この記事ではユースケースごとの使いどころを整理したうえで、ブラウザだけで完結する変換手順を紹介します。
まず結論から
HTML to Markdown に HTML を貼り付けて実行ボタンを押すだけで、Markdown が出力されます。インストール不要、ブラウザ内で処理が完結するのでデータが外部に送信されることもありません。
出力される Markdown は CommonMark を基本構文として採用し、表・タスクリスト・打ち消し線・自動リンクなどの拡張は GitHub Flavored Markdown 仕様 に準拠しています。
どんな場面で変換が必要になるか
WordPress や CMS からの移行
WordPress の記事データは HTML 形式でエクスポートされます。これを Hugo、Astro、Jekyll などの静的サイトジェネレータに移行するには、各記事を Markdown に変換する必要があります。記事数が少なければ手作業でも対応できますが、構造を崩さずに一括変換するならツールを使うのが確実です。
Notion エクスポートの整形
Notion は HTML 形式でのエクスポートに対応しています。ただし出力される HTML には Notion 独自の class 属性やネストされた div が大量に含まれており、そのまま他のツールに持ち込むには扱いづらい形式です。Markdown に変換すれば不要な装飾が取り除かれ、可読性の高いテキストになります。
Web ページのクリップ
Web ページの内容をメモやドキュメントに引用したいとき、HTML をそのままコピーするとタグやスタイルが混入します。Markdown に変換すれば構造だけを残した読みやすいテキストになります。LLM にコンテキストとして渡す場合にも、HTML よりトークン効率のよい Markdown の方が適しています。
HTML メールの再利用
受信した HTML メールの本文をドキュメントに転記するとき、HTML タグを手で削除するのは手間がかかります。変換ツールを使えば見出し・リスト・リンクの構造を保ったまま Markdown テキストとして取り出せます。
FormatArc で変換する
HTML to Markdown は、HTML を貼り付けてボタンを押すだけで Markdown を出力します。
ステップ 1: ツールを開く
HTML to Markdown にアクセスします。
ステップ 2: HTML を貼り付ける
左側のエディタに変換したい HTML を貼り付けます。<table>、<ul>、<ol>、<a>、<img> など主要なタグに対応しています。
ステップ 3: 実行ボタンを押す
実行ボタンを押すと、右側に Markdown が出力されます。


処理はブラウザ内で完結します。社内ドキュメントや未公開コンテンツを貼り付けても外部サーバーに送信されません。
HTML 要素と Markdown の対応表
多くの HTML 要素は Markdown に対応していますが、Markdown は HTML より小さな言語のため、対応する記法のない属性や構造は削除されます。下の表は GitHub Flavored Markdown への要素単位の対応関係と、失われるものを一覧にしたものです。要素名は現在の HTML の正式なリファレンスである WHATWG HTML Living Standard に従っています(W3C が最後に発行した日付入りスナップショットである HTML 5.2 Recommendation は廃止済みで、現在は主に歴史的な参照対象です)。Markdown 側は CommonMark と GitHub Flavored Markdown 仕様 に従います。
| HTML 要素 | GFM Markdown の対応記法 | 変換時の注意 / 失われるもの |
|---|---|---|
見出し <h1>–<h6> |
# ~ ######(ATX) |
見出しレベルごとに # を 1 つ使います。<h1> は #、<h6> は ###### に対応します。CommonMark は HTML と同じく 6 レベルだけを定義しています。 |
順序なしリスト <ul> |
-、*、+ のマーカー |
項目のネストはインデントで保持されます。どの記号を使うかは変換ツールに依存します。 |
順序付きリスト <ol> |
1.、2.、… のマーカー |
start 属性(先頭の番号指定)と type(a、i など)には Markdown の対応記法がなく、削除されます。 |
テーブル <table> |
GFM パイプテーブル | ヘッダー行と列の配置(align)は変換されます。colspan / rowspan、セル内のブロック要素、<caption> にはパイプテーブルの対応がありません。 |
リンク <a href> |
[text](url) |
href とリンクテキストは保持されます。target、rel、title などの属性は削除されますが、title だけは任意の [text](url "title") 形式に対応します。 |
画像 <img src alt> |
 |
src と alt は保持されます。width、height、srcset、loading などの属性には Markdown の記法がなく、削除されます。 |
コード <pre> / <code> |
フェンス / インデントブロック、インライン `code` |
<pre><code> はコードブロックになり、単独の <code> はインラインコードになります。class="language-…" のヒントはフェンスブロックの info string(例: ```js)として出力できます。 |
引用 <blockquote> |
> プレフィックス |
各行に > が付きます。ネストした引用は > を重ねます。cite 属性には Markdown の対応がなく、削除されます。 |
太字 <strong> / <b> |
**text** |
<strong>(意味的)と <b>(見た目)は同じ ** 記法にまとまり、意味的な区別は保持されません。 |
斜体 <em> / <i> |
*text* |
<em> と <i> は同じ * 記法にまとまり、意味的な区別は保持されません。 |
上の表に行のないもの(style、class、<div> / <span> のラッパー、インラインのイベントハンドラ、その他の見た目用マークアップ)は削除され、構造的な Markdown だけが残ります。GFM は inline HTML を許容するため、変換ツールは未対応の構造を削除する代わりに raw HTML 断片として残すこともあります。
CLI とライブラリの選択肢
ブラウザツール以外にも、コマンドラインやプログラムから変換する方法があります。使い慣れた言語スタックに合うものを選んでください。
Pandoc(汎用 CLI)
pandoc -f html -t markdown -o output.md input.html
HTML だけでなく Word・EPUB・LaTeX も扱える汎用変換ツールです。-t gfm を指定すれば GitHub Flavored Markdown のテーブルが出力されます。複雑な元ドキュメントや一括変換に向きます。ローカルインストールが必要です。
Turndown (JavaScript / Node.js)
import TurndownService from "turndown";
const turndown = new TurndownService();
const markdown = turndown.convert("<h1>Hello</h1><p>World</p>");
console.log(markdown);
Node.js プロジェクトの定番ライブラリです。turndown-plugin-gfm プラグインで表・打ち消し線・タスクリストにも対応します。ブラウザでも動作するため、セルフホストの変換機能を組み込みたい場合にも使えます。
Python と Go のライブラリ
ビルドパイプラインが Node.js ではなく Python や Go の場合、エコシステムごとに定番ライブラリが分かれています。
markdownify (Python)
pip install markdownify
from markdownify import markdownify
html = "<h1>Title</h1><p>Hello <strong>world</strong></p>"
print(markdownify(html, heading_style="ATX"))
markdownify は BeautifulSoup をラップしているため、スクレイピングで取得した雑な HTML にも強いです。heading_style="ATX"、bullets="-*+"、strip=["script", "style"] などのオプションで出力を細かく制御できます。
html2text (Python)
pip install html2text
import html2text
print(html2text.html2text("<h1>Title</h1><p>Hello world</p>"))
html2text は古くから保守されているライブラリで、CLI (html2text input.html) としても動作します。保存済みの Web ページを単発で変換するときに便利です。
html-to-markdown (Go)
go install github.com/JohannesKaufmann/html-to-markdown/cli/html2markdown@latest
html2markdown < input.html > output.md
Go コミュニティの事実上の標準です。ライブラリと CLI バイナリの両方として配布され、表・打ち消し線・カスタムルール用のプラグイン機構があります。Docker イメージや CI ランナー用に静的リンク済みバイナリ 1 つで動かしたいケースに向きます。
用途別の選び方
| ツール | インストール | 言語 | 向いている用途 |
|---|---|---|---|
| FormatArc | 不要(ブラウザ) | — | 単発変換、機微なデータ |
| Pandoc | Homebrew / apt | CLI | 一括変換、複数の元フォーマット |
| Turndown | npm | JavaScript | Node.js サービス、ブラウザ |
| markdownify | pip | Python | Web スクレイピングのパイプライン |
| html2text | pip | Python | 保存した Web ページの変換 |
| JohannesKaufmann | go install | Go | CI / Docker 用の静的バイナリ |
HTML テーブルを Markdown に変換する
多くの変換ツールが躓きやすいのが HTML テーブルの扱いです。専用に整理しておきます。
Markdown のパイプテーブルは GitHub Flavored Markdown 仕様 で定義されており、ヘッダー行・本文行・列の配置指定までは表現できます。一方で、HTML 側のすべての構造に対応するわけではありません。
きれいに変換できるパターン
<thead> / <tbody> を持ち、セルが単純な <td> で、ヘッダーに align="left|center|right" を指定している標準的なテーブルは、ほぼロスレスで往復できます。
<table>
<thead><tr><th>Name</th><th align="right">Price</th></tr></thead>
<tbody>
<tr><td>Apple</td><td align="right">120</td></tr>
<tr><td>Banana</td><td align="right">80</td></tr>
</tbody>
</table>
これは次のように変換されます。
| Name | Price |
|--------|------:|
| Apple | 120 |
| Banana | 80 |
変換できないパターン
Markdown に直接対応するものが無いパターンが 3 つあります。
colspan/rowspan— パイプテーブルは必ず矩形です。結合セルは変換ツールごとに分解・分割されます。- セル内のブロック要素 —
<td>内に<ul>・<pre>・別の<table>が入っている場合、Markdown 側には載せられません。インライン要素(<strong>、<em>、<a>、<code>)なら通ります。 - セル内改行 — セル内の
<br>はパーサーによって挙動が分かれます。多くは無視するか、または GFM が許可する inline HTML として<br>をそのまま出力します。
対処法
パイプテーブルでは表現できない構造に出会ったときの実務的な手段は 2 つあります。
- 本文を Markdown に変換しつつ、該当テーブルだけ raw HTML として残す。GFM は inline HTML を許容するため、
<table>...</table>をそのまま Markdown に埋め込めば GitHub・Hashnode・主要な静的サイトジェネレータでもレンダリングされます。 - そもそも「データ」なら、行と列で表現してから CSV to Markdown に通す。レイアウトではなくデータの場合は、この経路のほうが安定します。
Markdown テーブル構文(パイプ区切り、配置指定、セル内エスケープ、改行の扱い)については Markdown 表の書き方 と GFM テーブルチートシート で詳しく解説しています。
GFM テーブルの全パターンをツール画面と並べて確認したい場合は HTML to Markdown を別タブで開いて貼り付けてみてください。
よくある問題と対処法
スタイル / class 属性の除去
style 属性や class 属性は Markdown に対応する概念がないため、変換時に自動的に削除されます。装飾情報が必要な場合は変換前の HTML を保持しておくのが安全です。
スタイル情報も重要なプロジェクト(ニュースレター、ブランド入りエクスポート等)では、構造だけを Markdown に変換しておき、最後に Markdown to HTML で CSS を当てて再レンダリングする運用が現実的です。
画像パスの扱い
<img src="..."> は  に変換されますが、相対パスで書かれた画像は変換先の環境でパスが通らないことがあります。
HTML to Markdown でまず変換を試して alt テキストとリンク構造を確認してから、画像ファイルの移動・パスの書き換えを別パスで行うのが安全です。
よくある質問
GitHub Flavored Markdown のテーブルに対応していますか?
対応しています。HTML の <table> 要素は GFM のパイプテーブル (| col1 | col2 |) に変換され、ヘッダ行や単純な配置指定もある程度保持されます。Markdown のテーブル構文(パイプ区切り、配置指定、セル内エスケープ)について詳しくは Markdown 表の書き方 を参照してください。
変換はブラウザ内で行われますか?
HTML のパースと Markdown の出力は、すべてブラウザ内で JavaScript として実行されます。社内 HTML ドラフトや未公開コンテンツを貼り付けても外部サーバーに送信されません。
Pandoc や Turndown と何が違いますか?
Pandoc や Turndown は強力な変換エンジンですが、Pandoc はローカルインストール、Turndown は Node.js プロジェクトへの組み込みが必要です。ブラウザツールは単発の変換で速く済みます。貼り付けて Run、結果をコピーするだけです。バッチ処理やビルドパイプラインなら Pandoc のほうが適しています。
画像と相対パスは保持されますか?
<img src="..."> は  に変換され、ソース URL と alt テキストが保持されます。元 HTML の相対パスはそのまま残るため、移行作業の場合は画像ファイルを別途コピーし、変換後の Markdown でパスを書き換える運用になります。
class や style 属性はなぜ削除されますか?
Markdown にはインライン CSS や class 属性に相当する記法がありません。変換では意図的にこれらを削除し、クリーンで移植性の高い Markdown を生成します。元のスタイル情報が必要なら、変換前の HTML を保管しておいてください。逆に Markdown から HTML へ戻す場合は Markdown to HTML 変換ガイド を参照してください。
まとめ
HTML から Markdown への変換は、CMS の移行、Web ページのクリップ、エクスポートデータの整形など幅広い場面で必要になります。ちょっとした変換なら HTML to Markdown にブラウザから貼り付けるのが手早いです。
逆方向の Markdown から HTML への変換が必要な場合は Markdown to HTML 変換ガイド を、CSV から Markdown テーブルを作りたい場合は CSV to Markdown 変換ガイド を参照してください。