Markdown to HTML Converter
Paste or type Markdown on the left and see the rendered HTML on the right — live, in your browser. Supports full GitHub Flavoured Markdown: tables, task lists, strikethrough, fenced code blocks, images, and links. Copy the HTML or download a complete .html file.
Markdown
Markdown to HTML Converter
Convert GitHub Flavoured Markdown to HTML instantly — no server, no sign-up.
Features
- Supports italic, bold, and
strikethrough - Fenced code blocks with language hints
- Tables, task lists, and blockquotes
Code Example
function greet(name) {
return `Hello, ${name}!`;
}
Task List
- Paste your Markdown
- See the rendered Preview
- Copy or download the HTML
Table
| Format | Example | Output |
|---|---|---|
| Bold | **text** |
text |
| Italic | _text_ |
text |
| Strike | ~~text~~ |
Switch to HTML Source to see the generated markup.
Try a Quick Example
Click any example to load it into the editor.
How to use this tool
- Paste your Markdown into the left editor, or type directly. The right panel updates in real time.
- The right panel shows a rendered Preview by default — formatted headings, bold text, lists, tables, and code blocks.
- Click 'HTML Source' on the right panel to switch from the rendered preview to raw HTML code.
- Click 'Copy HTML' to copy the generated HTML to your clipboard.
- Click 'Download .html' to save a complete, standalone HTML document to your device.
- Use 'Try a Quick Example' below the editor to load a preset — README, blog post, changelog, docs page, FAQ, or comparison table.
- Clear the editor with the trash icon and start fresh, or load another example.
- Paste the copied HTML into your CMS, blog platform, documentation system, email template, or any tool that accepts HTML input.
Why use our Markdown to HTML Converter?
Markdown is the standard writing format for README files, documentation, changelogs, and CMS content — but most publishing targets require HTML. This converter bridges that gap instantly, running entirely in your browser with no server calls. Your text stays private, conversion is immediate, and the output is clean, standards-compliant HTML you can use anywhere.
Markdown Syntax Guide
A complete reference for Markdown syntax — Markdown input on the left, HTML output on the right.
# Heading 1 ## Heading 2 ### Heading 3
<h1>Heading 1</h1> <h2>Heading 2</h2> <h3>Heading 3</h3>
Use # for H1, ## for H2, ### for H3, up to ###### for H6.
**Bold text** __Also bold__
<strong>Bold text</strong> <strong>Also bold</strong>
Wrap text in **double asterisks** or __double underscores__.
*Italic text* _Also italic_
<em>Italic text</em> <em>Also italic</em>
Wrap text in *single asterisks* or _single underscores_.
***Bold and italic***
<strong><em>Bold and italic</em></strong>
Use ***triple asterisks*** for bold and italic together.
~~Struck through~~
<del>Struck through</del>
Wrap text in ~~double tildes~~ — GitHub Flavored Markdown only.
Use `console.log()` here.
Use <code>console.log()</code> here.
Wrap text in `backticks` for inline code.
```javascript const x = 42; console.log(x); ```
<pre><code class="language-javascript"> const x = 42; console.log(x); </code></pre>
Use triple backtick fences. Add a language name for syntax hints.
> This is a blockquote. > It can span multiple lines.
<blockquote> <p>This is a blockquote. It can span multiple lines.</p> </blockquote>
Prefix a line with > to create a blockquote.
1. First item 2. Second item 3. Third item
<ol> <li>First item</li> <li>Second item</li> <li>Third item</li> </ol>
Start lines with numbers followed by a period. Numbers are automatically corrected.
- Apple - Banana - Cherry
<ul> <li>Apple</li> <li>Banana</li> <li>Cherry</li> </ul>
Use -, +, or * to create bullet points.
- Parent item - Child item - Another child
<ul> <li>Parent item <ul> <li>Child item</li> <li>Another child</li> </ul> </li> </ul>
Indent with 2 or 4 spaces to create sub-lists.
- [x] Completed task - [ ] Pending task
<ul> <li><input checked disabled type="checkbox"> Completed task</li> <li><input disabled type="checkbox"> Pending task</li> </ul>
Use - [ ] for unchecked and - [x] for checked — GitHub Flavored Markdown only.
[Visit DecoToolkit](https://decotoolkit.com)
<a href="https://decotoolkit.com">Visit DecoToolkit</a>
Use [link text](URL) — add a title with [text](URL "Title").
<img src="https://example.com/image.png" alt="Alt text">
Use  — same as a link but with a ! prefix.
| Name | Role | |-------|--------| | Alice | Dev | | Bob | Design |
<table> <thead><tr><th>Name</th><th>Role</th></tr></thead> <tbody> <tr><td>Alice</td><td>Dev</td></tr> <tr><td>Bob</td><td>Design</td></tr> </tbody></table>
Use pipes | and hyphens --- to build tables. Use colons for column alignment.
---
<hr>
Use three or more hyphens (---), asterisks (***), or underscores (___) on a line alone.
\*not italic\*
<p>*not italic*</p>
Prefix any Markdown character with \ to render it literally.
Supported Markdown Features
This converter uses the marked library with GitHub Flavored Markdown (GFM) enabled. All features below are fully supported.
Common Markdown Mistakes
Avoid these common pitfalls when writing Markdown.
Some text here - Item one - Item two
Some text here - Item one - Item two
| A | B | | 1 | 2 |
| A | B | |---|---| | 1 | 2 |
[Click here]https://example.com
[Click here](https://example.com)
``` code here (missing closing fence)
``` code here ```
First paragraph. Second paragraph.
First paragraph. Second paragraph.
What is Markdown?
Markdown is a plain-text formatting syntax designed to be readable as-is and convertible to HTML. Created by John Gruber and Aaron Swartz in 2004, it uses simple punctuation characters — such as #, *, and > — to indicate structure and emphasis. Markdown is now the standard writing format for technical documentation, open-source projects, and developer-focused content platforms.
- README files on GitHub, GitLab, and Bitbucket
- Documentation generated by tools like MkDocs, Docusaurus, and Jekyll
- Blog posts on platforms like Ghost, Hashnode, and Dev.to
- Notes in apps like Obsidian, Notion, and Bear
- Chat messages in Slack, Discord, and Microsoft Teams
- Static site generators including Hugo, Eleventy, and Astro
Common Use Cases for a Markdown to HTML Converter
A Markdown to HTML converter is useful any time you have content written in Markdown but need HTML output. Here are the most common scenarios:
- Publishing blog posts or articles in a CMS that accepts HTML input
- Converting a project README into a documentation website page
- Generating HTML email templates from Markdown drafts
- Exporting Markdown notes from apps like Obsidian or Typora to HTML
- Embedding formatted content in tools that only support HTML (Mailchimp, HubSpot, etc.)
- Creating HTML snippets for inclusion in static sites or single-page applications
- Verifying what HTML a Markdown document will produce before deploying
Best Practices When Writing Markdown
Following consistent Markdown conventions prevents rendering issues and keeps your documents portable across tools and platforms.
- Always add a blank line before a list, code block, or blockquote
- Prefer ATX headings (# H1) over Setext style — they are easier to scan and supported everywhere
- Use fenced code blocks (``` lang) rather than 4-space indentation — more readable and support language hints
- Escape special characters (*, _, [, ]) with a backslash when you want them to appear literally
- Keep table columns aligned with padding spaces — it does not affect output but improves readability
- Use relative URLs for internal links in documentation projects
- Test your Markdown in the target platform as well as a converter — minor rendering differences exist between parsers
Frequently Asked Questions
What is Markdown?
Markdown is a lightweight plain-text formatting language created by John Gruber in 2004. It uses simple punctuation characters — like # for headings, **bold**, and *italic* — to indicate formatting. The idea is that Markdown is readable as plain text while also converting cleanly to HTML. Today it is used in GitHub README files, documentation systems, blogging platforms, note-taking apps, and more.
What is HTML, and how does Markdown relate to it?
HTML (HyperText Markup Language) is the standard language browsers use to render web pages. Markdown and HTML serve the same purpose — structured, formatted text — but Markdown is easier to write and read. A Markdown converter takes your Markdown source and outputs the equivalent HTML tags: ## becomes <h2>, **bold** becomes <strong>, and so on.
What is GitHub Flavoured Markdown (GFM)?
GitHub Flavoured Markdown is a superset of the original Markdown specification, created by GitHub. It adds tables, task lists (checkboxes), strikethrough (~~text~~), fenced code blocks with language hints, and auto-linking of URLs. GFM has become the de facto standard used by most Markdown tools and platforms, and this converter supports it fully.
What Markdown features are supported?
This converter supports the full GitHub Flavoured Markdown spec: headings (H1–H6), bold, italic, bold+italic, strikethrough, inline code, fenced code blocks, blockquotes, ordered lists, unordered lists, nested lists, task lists, links, images, tables, horizontal rules, and raw HTML passthrough. A complete syntax reference guide is available further down this page.
Is my Markdown sent to a server?
No. All conversion happens entirely in your browser using the open-source marked library. Nothing you type is ever sent to a server or stored anywhere. You can even use this tool offline once the page has loaded.
Can I use the downloaded .html file directly in a browser?
Yes. The downloaded file is a complete, standalone HTML document with a DOCTYPE declaration and <html>, <head>, and <body> tags. You can open it directly in any browser. Note that it does not include CSS, so it will render with default browser styles unless you add a stylesheet manually.
Can I convert a README.md file to HTML with this tool?
Yes. Open your README.md file, copy its contents, and paste them into the editor. The tool renders GitHub Flavoured Markdown identically to how GitHub renders it — headings, code blocks, tables, task lists, and images all work. You can then copy the HTML for use in documentation sites, wikis, or anywhere else.
Can I use the generated HTML in WordPress, Ghost, or other CMS platforms?
Yes. The generated HTML is clean, standards-compliant, and compatible with any CMS or platform that accepts HTML input. In WordPress, paste it into the HTML block or the Custom HTML block. In Ghost, use the HTML card. Most static site generators (Hugo, Jekyll, Eleventy) also accept HTML partials directly.
What happens to inline HTML inside my Markdown?
Inline HTML is passed through unchanged. If you write a <div> or <span> inside your Markdown, it will appear as-is in the output. This is standard Markdown behaviour and is useful for adding styling or elements that Markdown syntax does not support natively.
Does this tool add syntax highlighting to code blocks?
The converter adds language class attributes to fenced code blocks (e.g., <code class="language-javascript">) which are recognised by popular syntax highlighting libraries like Prism.js or highlight.js. However, the tool itself does not bundle a highlighter — you will need to include one in your final page if you want colour-coded output.
How do I add images in Markdown?
Use the syntax  — for example, . The alt text is important for accessibility. To add a title tooltip, use . Images must already be hosted somewhere; this tool does not upload files.
How do I create task list checkboxes?
Use - [ ] for an unchecked item and - [x] for a checked item. For example, `- [x] Write the README` creates a checked checkbox and `- [ ] Deploy to production` creates an unchecked one. This is a GitHub Flavoured Markdown extension not available in basic Markdown.
How do I create a table in Markdown?
Use pipe characters to separate columns and hyphens to define the header row: `| Column 1 | Column 2 |` on the first line, `|----------|----------|` on the second, then `| Value 1 | Value 2 |` for each data row. Align columns with colons: `|:------|` for left, `|------:|` for right, `|:------:|` for centre.
What is the difference between the Preview and HTML Source views?
Preview renders your Markdown as formatted HTML — you see headings, bold text, tables, and lists as they would appear in a browser. HTML Source shows the raw HTML code that was generated from your Markdown, which you can copy and use directly in your project. You can switch between the two views at any time using the toggle above the right panel.
Related Tools
Markdown Table Generator
Build Markdown tables visually or paste from Excel, Google Sheets, or CSV. Set column alignment and export GFM.
YAML to JSON Converter
Convert between YAML and JSON instantly. Auto-detects direction — all in your browser.
Base64 Encoder / Decoder
Encode and decode Base64 text quickly and easily.
Color Picker & Converter
Pick colors and convert between HEX, RGB, HSL, HSV, and CMYK instantly. Check WCAG contrast ratios.
Recently Visited Tools
URL Encoder / Decoder
DeveloperEncode URLs to percent-encoded format or decode encoded URLs back to readable text.
YAML to JSON Converter
DeveloperConvert between YAML and JSON instantly. Auto-detects direction — all in your browser.
Color Picker & Converter
DeveloperPick colors and convert between HEX, RGB, HSL, HSV, and CMYK instantly. Check WCAG contrast ratios.