HTML to Markdown

Convert HTML tags to clean Markdown syntax with GFM table and code block support.

HTML Input

Markdown Output

Introduction

HTML to Markdown reverses the usual direction: hand it HTML — whether that came from a CMS export, a scraped page, or a legacy wiki — and the converter returns the equivalent Markdown source. Under the hood it runs the turndown library with GFM extensions enabled, so tables and fenced code blocks translate cleanly instead of collapsing into plain paragraphs.

Markdown is a friendlier source format for version control, pull requests, and static site pipelines. Converting HTML back to Markdown is how most teams migrate off older publishing stacks: you export the rendered pages, pipe them through a converter, and land on a flat directory of .md files that diff cleanly in Git.

The conversion happens entirely in your browser. There is no upload step, so internal articles and draft content never leave the tab.

How to Use

Paste your HTML source into the left editor.
Read the converted Markdown in the right pane — it updates as you type.
Scan the output for elements the converter could not map (e.g. complex tables).
Copy the Markdown to the clipboard or download it as a .md file.
Commit the result to your repository or import it into your Markdown CMS.

Examples

Example 1: Blog post export

Input

<h1>Shipping faster with trunk-based dev</h1>
<p>We moved off long-lived feature branches
<strong>last quarter</strong>.</p>
<p>Read the
<a href="https://example.com/trunk">retrospective</a>.</p>

Output

# Shipping faster with trunk-based dev

We moved off long-lived feature branches **last quarter**.

Read the [retrospective](https://example.com/trunk).

Example 2: CMS migration — nested lists

Input

<ul>
  <li>Frontend
    <ul>
      <li>React</li>
      <li>Next.js</li>
    </ul>
  </li>
  <li>Backend
    <ul>
      <li>Go</li>
      <li>Postgres</li>
    </ul>
  </li>
</ul>

Output

- Frontend
  - React
  - Next.js
- Backend
  - Go
  - Postgres

Example 3: Documentation with a code block

Input

<h2>Install</h2>
<p>Use the package manager of your choice:</p>
<pre><code class="language-bash">pnpm add turndown</code></pre>
<blockquote>
  <p>Node 18 or newer is required.</p>
</blockquote>

Output

## Install

Use the package manager of your choice:

```bash
pnpm add turndown
```

> Node 18 or newer is required.

Target language details

Version assumptions and style choices baked into the generated output. If your runtime is older, you may need to adjust syntax (e.g. drop optional chaining, use `var` instead of `const`).

Language	Version	Output style
Markdown	GitHub Flavored Markdown (GFM)	Tables, fenced code, task lists, strikethrough supported.

Key Features

GFM output: tables become pipe tables, code fences land with the correct language tag, and strikethrough survives the round-trip.
Nested list handling: ordered and unordered lists keep their indentation, so hierarchies survive the conversion.
Link and image preservation: href, src, and alt attributes map to the Markdown equivalents without loss.
Instant conversion: the right pane updates as soon as the HTML on the left parses cleanly.
Copy or download: ship the Markdown to the clipboard or save it to disk with one click.
Runs client-side: no data uploads, so internal content stays in the tab.

Frequently Asked Questions

What happens to HTML elements without a Markdown equivalent?

Tags like <div>, <span>, or custom web components do not have a Markdown counterpart. The converter keeps their inner text and drops the tags. If you need to preserve structure, the HTML tag itself can remain inside the Markdown document.

How are tables converted?

Standard <table> elements with thead and tbody rows translate to GFM pipe tables. Merged cells (colspan/rowspan) have no direct Markdown form and will lose their spans.

Does the converter handle code blocks with language hints?

Yes. A <pre><code class="language-python"> wrapper becomes a fenced code block starting with ```python, preserving the language hint for downstream highlighters.

What about inline styles and classes?

Inline style and class attributes are dropped since Markdown has no way to express them. Semantic tags (strong, em, code) map to the closest Markdown syntax.

Can I feed it an entire web page?

You can, but you will likely want the body content only. Paste the article body rather than the full <html> document to avoid navigation, headers, and footers polluting the Markdown output.

Related Tools

JSON to Markdown Converter

Convert JSON data to Markdown format with nested structure and type display support.

CSV Converter

Convert CSV to XML, YAML, SQL, or Markdown in one unified tool.

XML Converter

Convert XML to CSV, YAML, SQL, or Markdown in one unified tool.

YAML Converter

Convert YAML to CSV, XML, SQL, or Markdown in one unified tool.

Markdown to HTML

Convert Markdown to clean HTML with GFM support and live preview.

HTML to Markdown

Convert HTML tags to clean Markdown syntax with GFM table and code block support.

HTML Input

Markdown Output

Introduction

The conversion happens entirely in your browser. There is no upload step, so internal articles and draft content never leave the tab.

How to Use

Paste your HTML source into the left editor.
Read the converted Markdown in the right pane — it updates as you type.
Scan the output for elements the converter could not map (e.g. complex tables).
Copy the Markdown to the clipboard or download it as a .md file.
Commit the result to your repository or import it into your Markdown CMS.

Examples

Example 1: Blog post export

Input

<h1>Shipping faster with trunk-based dev</h1>
<p>We moved off long-lived feature branches
<strong>last quarter</strong>.</p>
<p>Read the
<a href="https://example.com/trunk">retrospective</a>.</p>

Output

# Shipping faster with trunk-based dev

We moved off long-lived feature branches **last quarter**.

Read the [retrospective](https://example.com/trunk).

Example 2: CMS migration — nested lists

Input

<ul>
  <li>Frontend
    <ul>
      <li>React</li>
      <li>Next.js</li>
    </ul>
  </li>
  <li>Backend
    <ul>
      <li>Go</li>
      <li>Postgres</li>
    </ul>
  </li>
</ul>

Output

- Frontend
  - React
  - Next.js
- Backend
  - Go
  - Postgres

Example 3: Documentation with a code block

Input

<h2>Install</h2>
<p>Use the package manager of your choice:</p>
<pre><code class="language-bash">pnpm add turndown</code></pre>
<blockquote>
  <p>Node 18 or newer is required.</p>
</blockquote>

Output

## Install

Use the package manager of your choice:

```bash
pnpm add turndown
```

> Node 18 or newer is required.

Target language details

Version assumptions and style choices baked into the generated output. If your runtime is older, you may need to adjust syntax (e.g. drop optional chaining, use `var` instead of `const`).

Language	Version	Output style
Markdown	GitHub Flavored Markdown (GFM)	Tables, fenced code, task lists, strikethrough supported.

Key Features

GFM output: tables become pipe tables, code fences land with the correct language tag, and strikethrough survives the round-trip.
Nested list handling: ordered and unordered lists keep their indentation, so hierarchies survive the conversion.
Link and image preservation: href, src, and alt attributes map to the Markdown equivalents without loss.
Instant conversion: the right pane updates as soon as the HTML on the left parses cleanly.
Copy or download: ship the Markdown to the clipboard or save it to disk with one click.
Runs client-side: no data uploads, so internal content stays in the tab.

Frequently Asked Questions

What happens to HTML elements without a Markdown equivalent?

How are tables converted?

Standard <table> elements with thead and tbody rows translate to GFM pipe tables. Merged cells (colspan/rowspan) have no direct Markdown form and will lose their spans.

Does the converter handle code blocks with language hints?

Yes. A <pre><code class="language-python"> wrapper becomes a fenced code block starting with ```python, preserving the language hint for downstream highlighters.

What about inline styles and classes?

Inline style and class attributes are dropped since Markdown has no way to express them. Semantic tags (strong, em, code) map to the closest Markdown syntax.

Can I feed it an entire web page?

You can, but you will likely want the body content only. Paste the article body rather than the full <html> document to avoid navigation, headers, and footers polluting the Markdown output.