KKwikfig.

Markdown to HTML Converter

Convert Markdown to clean HTML as you type, with a live preview beside the source — headings, lists, links and code rendered by GitHub-flavoured rules. Runs entirely in your browser — your numbers never leave this device.

Markdown
Preview

Kwikfig Notes

Write Markdown on the left.

  • Live preview
  • HTML source

Visit Kwikfig

HTML source

How it works

Markdown → HTML by rule: # text → <h1>text</h1>, **text** → <strong>text</strong>, *text* → <em>text</em>, - item → <li> inside a <ul>, [text](url) → <a href="url">text</a>, `code` → <code>code</code> | GitHub-flavoured Markdown is on; a single line break inside a paragraph does not create a <br> — a blank line starts a new paragraph

Type or paste Markdown on the left and the HTML appears on the right, rendered by a full Markdown parser (the marked parser, loaded only on this page) with GitHub-flavoured Markdown enabled — so tables, fenced code blocks, task lists and strikethrough behave the way they do in a README or an issue comment. A rendered preview sits beside the generated markup, because the two answer different questions: the preview shows what readers will see, and the HTML is what you copy into a template, an email builder or a static site.

The rules that surprise people are worth stating. A single Enter inside a paragraph is treated as a space — paragraphs are separated by blank lines, and a line that should break visibly needs a list, a new paragraph or two trailing spaces. Emphasis markers must hug their text: ** bold ** with spaces inside the asterisks stays literal. And Markdown deliberately allows raw HTML in the source, which the parser passes through into the output — convenient for your own documents, and the reason converted output from an untrusted source still needs sanitising before it goes on a page, a job this converter does not claim to do.

Everything you type stays in the page: conversion happens in your browser as you type, drafts are never uploaded or stored, and closing the tab discards them — copy the HTML you need before you close it.

Worked examples

A heading and a bold phrase

Input
Markdown = # Hi, then a blank line, then **bold** text
Working
The # makes the first line a top-level heading. The blank line ends it, the next line becomes a paragraph, and the paired ** markers wrap 'bold' in a strong element.
Result
<h1>Hi</h1> <p><strong>bold</strong> text</p>

A two-item bullet list

Input
Markdown = - one / - two (one per line)
Working
Consecutive lines starting with - group into a single unordered list, one list item per line — the two items share one <ul> rather than each getting its own.
Result
<ul> <li>one</li> <li>two</li> </ul>

A link becomes an anchor element

Input
Markdown = [Kwikfig](https://kwikfig.pages.dev)
Working
The text in brackets becomes the anchor's visible text and the address in parentheses becomes its href. Standing alone on a line, the link is a paragraph, so it is wrapped in <p> tags. Inline code works the same miniature way: `npm run build` in backticks becomes <code>npm run build</code>, with nothing inside the backticks parsed as Markdown.
Result
<p><a href="https://kwikfig.pages.dev">Kwikfig</a></p>

Frequently asked questions

Which Markdown flavour does it use?

GitHub-flavoured Markdown (GFM), the dialect used by READMEs and issue trackers: fenced code blocks with language hints, tables, strikethrough with ~~text~~, and autolinked URLs, on top of the core CommonMark-style rules for headings, lists, emphasis and links. If a document renders on GitHub, it renders the same way here.

Why did my line break disappear?

Because a single newline inside a paragraph is a space in Markdown — paragraphs end at blank lines. The rule exists so source files can wrap long paragraphs at 80 characters without changing the output. For a visible break, start a new paragraph, use a list, or end the line with two spaces, which the parser turns into a <br>.

Is the HTML output safe to paste straight into my site?

For your own documents, yes. Two cautions: raw HTML written in the Markdown source passes through into the output unchanged — that is standard Markdown behaviour — so HTML converted from someone else's untrusted Markdown should be sanitised by a dedicated library before publication. And relative links and images keep their relative paths, so check them against where the HTML will actually live.

Why didn't my bold text turn bold?

Usually spacing or pairing: ** bold ** with a space inside the markers stays literal, and an odd number of ** markers leaves the last one unpaired and printed as-is. Markers must hug the text they wrap — **bold** — and every opening pair needs its closing pair on the same line or paragraph.

Can it convert HTML back to Markdown?

No — this tool converts in one direction, Markdown to HTML. The reverse is a different and lossier problem (most HTML has no Markdown equivalent for its attributes and structure), and rather than offer a half-faithful version, the page does the one direction properly. The HTML Entity Encoder in this category covers the related job of showing markup as text.

Is my draft stored or sent anywhere?

No. The parser runs in your browser and converts as you type — your text is never uploaded, stored or tracked, and it disappears when the tab closes, so copy finished HTML first.

Related tools

More in Developer Tools · Browse all tools