Convert Markdown and HTML in the browser
Review the Source of conversion results and a sanitized Preview separately without sending input to a server.
Convert HTML to MarkdownConclusion: Parse HTML as a DOM and map meaningful elements to Markdown syntax
h1–h6, p, strong/em, ul/ol, blockquote, pre/code, a, img, table, and similar elements can be mapped to Markdown.
Class, style, and data attributes, layout divs, complex tables, and similar elements have no equivalent Markdown representation, so simplification or loss occurs.
Verify separately that conversion succeeded and that meaning, appearance, and safety are preserved at the destination.
Process with the DOM and conversion Rules rather than Tag replacement
Because string replacement can easily break nesting, attributes, entities, and whitespace, build a tree with DOMParser and transform by node type.
The current tool does not retrieve HTML from URLs. Use HTML source or a file, and remove authentication cookies and personal information before sharing.
| Account to check | Confirmation details | judgment |
|---|---|---|
| Heading | h1～h6 | Number of # characters |
| List | ul/ol/li | Nested Indent |
| Code | pre/code | Fence length and language class |
| Link/Image | href/src | Base URL |
Steps for checking with a Markdown / HTML conversion tool
- Select HTML→Markdown, then paste HTML or open a File.
- Choose whether to retain, convert to Text, or remove unsupported elements.
- Enter a Base URL if you need to resolve relative URLs.
- Convert, then check the Markdown source and preview.
Do not include credentials or tokens in the base URL. The tool does not fetch URL destinations.
Mapping between HTML elements and Markdown
| HTML | Markdown | Information that may be lost |
|---|---|---|
| <h2> | ## | id / class |
| <strong> | ** ** | style |
| <a href> | [text](url) | data attributes |
| <table> | Pipe Table | rowspan and colspan |
Check conversion, display, and sanitization as separate steps.
| Process | Main role | What is not guaranteed here |
|---|---|---|
| Parse/conversion | Map Markdown syntax to HTML elements, or HTML DOM to Markdown notation | CSS appearance and destination-specific extensions |
| Sanitize | Exclude script, iframe, form, event attributes, dangerous URLs, and similar content. | Complete preservation of the original HTML and compliance with all business requirements |
| Preview | Check sanitized results in an iframe isolated from the main application | Same CSS as the production CMS and persistence of external resources |
| Save and paste | Output the checked source to a file or the clipboard | Re-sanitization and automatic formatting at the conversion destination |
A setting that allows raw HTML in Markdown is not a setting that disables sanitization. Whether to accept raw HTML as syntax and whether to remove dangerous elements from generated HTML are independent decisions. Do not put untrusted input directly into innerHTML without processing; sanitize after conversion as well, and isolate it from executable previews.
Regression tests to check after conversion
- Check headings, paragraphs, bold, italics, ordered, unordered, and nested lists, quotes, and horizontal rules
- Check inline code, fenced code, backticks within fences, language declarations, and HTML pre/code
- Check links, reference links, images, relative URLs, parentheses containing URLs, and title attributes
- Verify GFM tables, task lists, strikethrough, and autolinks using the same dialect as the destination
- Check Raw HTML, HTML Entities, &, <, >, two-space line breaks, blank lines, and Whitespace.
- Check that script, onclick, javascript:, iframe, form, and similar content cannot execute in the Preview or saved result.
- Compare the Markdown→HTML→Markdown round-trip diff and check for loss of meaning, attributes, whitespace, and expression formats
Supported scope of the current Markdown and HTML conversion tool
The current DevelopTools tool processes Markdown to HTML and HTML to Markdown only in the browser. Markdown to HTML uses Marked in GFM mode to convert headings, paragraphs, emphasis, lists, quotes, tables, task lists, strikethrough, code, links, and images. HTML to Markdown serializes DOM parsed by DOMParser using its own per-tag rules, converting headings, paragraphs, emphasis, lists, quotes, tables, pre/code, links, images, and more.
| Function | Current tool operation |
|---|---|
| Input | Paste Text, load Markdown / HTML Files, Drag & Drop |
| Markdown dialect | Marked GFM mode. Optionally switch the option that converts line breaks to br |
| HTML output | HTML fragment or complete document, formatted or minified to one line |
| HTML→Markdown | Custom converter. Choose whether to preserve, convert to text, or remove unsupported elements. |
| Safety | Sanitize conversion results with DOMPurify and preview in a sandbox iframe with CSP |
| External communication | Conversion itself sends nothing. A request is made to the image host only when an external image preview is explicitly enabled. |
| Unsupported | Fetching Web Pages from URLs, CSS reproduction, obtaining the DOM after JavaScript execution, complete round-trip restoration, Front Matter-specific parsing |
The converted source and preview are different things. Check the source intended for saving or pasting, then check the structure in the sanitized preview. Also verify final CSS appearance, CMS-specific sanitizers, relative URL bases, and the Markdown dialect adopted by the destination at the destination itself.
Check the specification and the library's official documentation
Markdown implementations differ, so check syntax expectations against CommonMark, GFM extensions against GitHub Flavored Markdown, and options for the parser in use against its official documentation. Marked officially states that it does not sanitize output HTML, so treat sanitization after conversion as a separate step. Turndown is reference material for understanding rules, keep, remove, and GFM plugin concepts as a representative HTML→Markdown implementation; the current tool itself does not use Turndown.
Example: convert CMS body HTML back to a Markdown draft
Enter an HTML fragment that includes h2, p, ul, pre/code, and a in the body.
It can be converted to Markdown for easier re-editing, but CMS-specific classes must be recorded separately.
- Extract HTML
- Unsupported element settings
- conversion
- Check Source differences.
The current tool is a custom converter and does not use Turndown.
Frequently asked questions
- Can Markdown→HTML→Markdown return perfectly to the original text?
- It cannot be fully restored. The same meaning can be expressed by multiple Markdown syntaxes, and Markdown has no equivalent representation for HTML class, style, data attributes, complex tables, or whitespace. Always check differences after a round trip.
- If Raw HTML is allowed, can scripts also be saved?
- The current Tool cannot save it. Separately from Raw HTML interpretation settings, DOMPurify removes script, iframe, form, event attributes, and more, and the Preview also uses CSP.
- Is the input content sent to a server?
- Conversion, File reading, Copy, and Download are completed in the browser. However, when external image Preview is enabled, the browser requests the image URL's Host.