HTML to Markdown Converter

How to Use the HTML to Markdown Converter

Paste any HTML fragment or a full page into the input field and click "Markdownに変換" (Convert). The tool parses your HTML with the browser's built-in DOMParser and walks the DOM tree recursively, emitting clean GitHub Flavored Markdown (GFM). Nothing is uploaded — the conversion runs entirely on your device.

Features

• Headings h1–h6 become ATX headings (# to ######)
• Nested ul/ol lists are converted with correct indentation
• table elements become GFM pipe tables with an auto-generated header separator
• pre/code blocks become fenced code blocks, with the language detected from class="language-xxx"
• Links, images, bold, italic, strikethrough, blockquotes, and horizontal rules are all supported
• script and style tags are always stripped, and consecutive blank lines are collapsed into one
• Unsupported tags can either keep their text content or be removed entirely — you choose

What is Markdown conversion useful for?

Markdown is the de facto standard for README files, static site generators, and documentation platforms such as GitHub, GitLab, Hugo, and Jekyll. Converting legacy HTML — exported blog posts, CMS content, or intranet pages — into Markdown lets you version-control your content, review changes with diffs, and publish it anywhere. A reliable HTML to Markdown converter saves hours of manual reformatting during blog migrations and documentation overhauls.

HTML to Markdown Converterの使い方

変換したいHTMLを入力欄に貼り付けて「Markdownに変換」を押すだけです。ブラウザ標準の DOMParser でHTMLを解析し、 DOMツリーを再帰的にたどってGFM(GitHub Flavored Markdown)を生成します。 対応タグは h1〜h6、p、a、img、ul/ol/li(ネスト対応)、pre/code、blockquote、table、strong/b、em/i、hr、br、del/s です。script と style は常に除去され、3行以上の連続空行は1つの空行に正規化されます。 未対応のタグ(span や font など)は「テキストを抽出」か「削除する」をオプションで選べます。

実務での活用例

1. ブログ移行(WordPress → Markdown)

WordPressからHugoやAstroなどの静的サイトジェネレーターへ移行する際、記事本文はHTMLのまま出力されます。 投稿編集画面のコードエディタやエクスポートXMLから本文HTMLをコピーして本ツールに貼り付ければ、 見出し・リスト・コードブロックを保ったままMarkdownファイル(.md)の素材が得られます。 画像は ![alt](URL) 形式でURL参照のまま出力されるので、移行先で画像をホスティングし直す場合はパスを一括置換してください。

2. 社内WikiやCMSのドキュメントをGitで管理

Confluenceや社内CMSのページをブラウザで開き、開発者ツールで該当部分のHTMLをコピーして変換すれば、 GitHubリポジトリの docs/ ディレクトリに置けるMarkdownになります。 テーブルはGFMパイプテーブルに変換されるため、仕様書の対応表や設定値一覧もそのままプルリクエストでレビューできます。

3. 既存WebページからREADMEを作成

製品紹介ページやランディングページの構成を流用してREADME.mdを書き起こす場合、 HTMLを貼り付けて変換すれば見出し階層(# / ## / ###)が保たれた下書きが即座にできます。 変換結果はMarkdown Previewで表示確認し、 文字数チェックにはWord Counterが使えます。

よくあるエラーと対処 / Common Errors and Fixes

HTML→Markdown変換で起こりやすいトラブルと原因をまとめました。

Common issues when converting HTML to Markdown, with causes and fixes.

言語別コード例 / Code Examples by Language

HTML→Markdown変換をスクリプトやバッチ処理で自動化する場合の定番ライブラリです。

Popular libraries for automating HTML to Markdown conversion in scripts and pipelines.

JavaScript (Turndown)

import TurndownService from "turndown";
import { gfm } from "turndown-plugin-gfm";

const turndown = new TurndownService({ headingStyle: "atx" });
turndown.use(gfm); // テーブル・取り消し線に対応 / enables tables & strikethrough

const markdown = turndown.turndown("<h1>Hello</h1><p><b>World</b></p>");
// => "# Hello\n\n**World**"

Python (markdownify)

from markdownify import markdownify as md

markdown = md(
    "<h1>Hello</h1><p><b>World</b></p>",
    heading_style="ATX",   # "#" 形式の見出し / ATX headings
    strip=["script", "style"],
)
print(markdown)  # "# Hello\n\n**World**"

Go (html-to-markdown)

import htmltomarkdown "github.com/JohannesKaufmann/html-to-markdown/v2"

markdown, err := htmltomarkdown.ConvertString(
    "<h1>Hello</h1><p><b>World</b></p>",
)
if err != nil {
    log.Fatal(err)
}
fmt.Println(markdown) // "# Hello\n\n**World**"

Shell (pandoc)

# HTMLファイルをGFMに一括変換 / Convert an HTML file to GFM
pandoc -f html -t gfm input.html -o output.md

# ディレクトリ内を一括処理 / Batch-convert a directory
for f in *.html; do pandoc -f html -t gfm "$f" -o "${f%.html}.md"; done

Before / After 実例 / Before & After

例1: 記事HTMLをMarkdownへ / Blog post HTML to Markdown

<h2>はじめに</h2>
<p>このツールは<strong>無料</strong>で使えます。
詳細は<a href="https://example.com/docs">ドキュメント</a>を参照。</p>

↓

## はじめに

このツールは**無料**で使えます。 詳細は[ドキュメント](https://example.com/docs)を参照。

例2: テーブルをGFMパイプテーブルへ / HTML table to GFM table

<table>
  <tr><th>Plan</th><th>Price</th></tr>
  <tr><td>Free</td><td>$0</td></tr>
  <tr><td>Pro</td><td>$10</td></tr>
</table>

↓

| Plan | Price |
| --- | --- |
| Free | $0 |
| Pro | $10 |

例3: ネストしたリスト / Nested lists

<ul>
  <li>フロントエンド
    <ul><li>React</li><li>Vue</li></ul>
  </li>
  <li>バックエンド</li>
</ul>

↓

- フロントエンド
  - React
  - Vue
- バックエンド

子リストは2スペースのインデントで階層が保持されます。

Nested lists keep their hierarchy with two-space indentation.

Why browser-only? / なぜブラウザ完結か

HTML you convert often comes from places you would not want to share: unpublished blog drafts, internal wiki pages, customer-facing documentation that is still under review, or CMS exports containing names and email addresses. A server-side converter receives all of that content the moment you press the button, and you have no way to verify what happens to it afterwards. This tool takes a different approach: it relies onDOMParser, a standard API built into every modern browser, and performs the entire DOM walk and Markdown generation in client-side JavaScript. No request leaves your machine — you can confirm this by opening DevTools, switching to the Network tab, and running a conversion: no new entries appear. It also works offline once the page is loaded, which makes it safe to use inside restricted corporate networks.

変換対象のHTMLには、公開前のブログ原稿、社内Wiki、レビュー中のドキュメント、氏名やメールアドレスを含むCMSエクスポートなど、 外部に出したくない内容が含まれがちです。本ツールはブラウザ標準APIの DOMParser だけで解析・変換を行い、 ネットワーク通信を一切発生させません。DevTools の Network タブを開いたまま変換しても新しいリクエストが記録されないことで、 外部送信がないことを自分で確認できます。