fileformer
search⌘KtranslateENexpand_moreupload_fileConvert
Converters8 file families · 44 direct conversions
What changes in a conversionarrow_forward
home/developer-tools/markdown-editor

Markdown Editor

Type Markdown on the left. See the page on the right.

A live editor for READMEs, notes and docs. Switch between GitHub-flavoured and strict CommonMark, copy the clean HTML, or download the .md file. Your text stays in your browser.

format_boldformat_italictitlelinkformat_list_bulletedchecklistcodetableformat_quote
GitHub-flavouredCommonMark
vertical_splitSplitvisibilityPreviewcode_blocksHTML
markdown
preview · github-flavoured

Weekend in Edinburgh

A short plan for two days, mostly on foot. Tickets are booked; the rest is flexible.

Checklist

  • ✓Book the train
  • ✓Reserve the hotel
  • Buy castle tickets
  • Pack a rain jacket

Budget

ItemCost
Train£84
Hotel, 2 nights£236
Castle£21.50

Tip: the castle is quietest before 10 am.

More ideas at https://www.visitscotland.com and in the notes.md file.

html output ·
words63reading time1 minheadings3tasks done2 / 4content_copyCopy HTMLdownloadDownload .md
~/one-syntax-many-dialects

Markdown that looks right on GitHub can break in Slack.

Every app supports a slightly different set. Click a feature to see its syntax rendered both ways, and which apps show it properly. Support changes over time; this reflects each app's help pages as of 2026.

GitHubRedditSlackDiscordNotionObsidian
Headingscheck_circlecheck_circlecancelcheck_circlecheck_circlecheck_circle
Bold & italiccheck_circlecheck_circlechange_circlecheck_circlecheck_circlecheck_circle
Strikethroughcheck_circlecheck_circlechange_circlecheck_circlechange_circlecheck_circle
Tablescheck_circlecheck_circlecancelcancelchange_circlecheck_circle
Task listscheck_circlecancelcancelcancelchange_circlecheck_circle
Footnotescheck_circlecancelcancelcancelcancelcheck_circle
Code blockscheck_circlecheck_circlecheck_circlecheck_circlecheck_circlecheck_circle
check_circlerenderschange_circledifferent syntax or partialcancelshows as plain text
Tables
| Item | Cost || --- | ---: || Train | £84 |
github-flavoured
ItemCost
Train£84
strict commonmark

| Item | Cost | | --- | ---: | | Train | £84 |

Notion turns a pasted table into its own table block. Slack and Discord show the pipes as text; not part of CommonMark.addAdd to the editor
~/why-did-it-do-that

Four ways Markdown surprises people, and the one-character fixes.

Each card renders the source with the same engine as the editor above. Switch between the broken and fixed versions; invisible spaces are shown as dots.

Line breaks disappear
BrokenTwo spaces
Roses are redViolets are blue

Roses are red Violets are blue

A single line break counts as a space, so the two lines run together.
snake_case turns italic
OriginalModern
Set my_file_name in the config.

Set myfilename in the config.

The original 2004 Markdown reads the underscores as emphasis markers.
A year becomes a list
BrokenEscaped
2025. What a year it was.
  1. What a year it was.
A number and full stop at the start of a line begins a numbered list, here starting at 2025.
Pasted text becomes code
BrokenUnindented
····Dear Sam,····Thanks for the photos.
Dear Sam,Thanks for the photos.
Four spaces of indentation mean “code block”. Common when pasting from email.
~/why-snake_case_survives

Whether a * makes italics depends on what's next to it.

CommonMark doesn't pair asterisks and underscores by counting them. Each run of them is classified as left-flanking, able to open emphasis, or right-flanking, able to close it. That depends on whether the characters on either side are spaces, punctuation or letters. Underscores have an extra rule, so snake_case_names stay plain. This applies the CommonMark 0.31 definitions to your text, character by character.

*foo bar*foo*bar*snake_case_name_foo_bar_a * b * c**foo**(*foo*)*föö_bär_
sanaaakaea_pcaaasaea_pnaaamaea
under each character: w whitespace · p punctuation · a anything else■ can open■ can close■ both■ neither
runatbefore · afterflankingrolewhy
_chars 6e (a) · c (a)left + rightliteralLetters on both sides: an underscore inside a word can’t open or close. This is the snake_case rule.
_chars 11e (a) · n (a)left + rightliteralLetters on both sides: an underscore inside a word can’t open or close. This is the snake_case rule.
No * or _ runs in this text.
THIS PAGE’S RENDERER GIVES<p style="margin:0 0 10px;line-height:1.65">snake_case_name
ruleUnderscores between letters are always literal in CommonMark, so snake_case_names never turn italic. Asterisks have no such rule: use * when you want emphasis inside a word, such as un*frigging*believable.
~/reference

Seven Markdown flavours, and what each adds.

John Gruber's 2004 Markdown left many edge cases undefined, so every implementation filled the gaps differently. CommonMark pins down the core with over 600 examples. Most flavours since are CommonMark plus extensions.

featureMarkdown.plCommonMarkGFMGitLabPandocMultiMarkdownObsidian
Tables| a | b |cancelcancelcheck_circlecheck_circlecheck_circlecheck_circlecheck_circle
Task lists- [x] donecancelcancelcheck_circlecheck_circlecheck_circlecancelcheck_circle
Strikethrough~~old~~cancelcancelcheck_circlecheck_circlecheck_circlecancelcheck_circle
Bare URL autolinkswww.example.comcancelcancelcheck_circlecheck_circlecheck_circlecancelcheck_circle
Footnotestext[^1]cancelcancelcheck_circlecheck_circlecheck_circlecheck_circlecheck_circle
Fenced code```jscancelcheck_circlecheck_circlecheck_circlecheck_circlecheck_circlecheck_circle
Math$x^2$cancelcancelcheck_circlecheck_circlecheck_circlecheck_circlecheck_circle
Heading IDs# Title {#id}cancelcanceladjustadjustcheck_circlecheck_circleadjust
Definition listsTerm: meaningcancelcancelcancelcancelcheck_circlecheck_circlecancel
Alerts / callouts> [!NOTE]cancelcancelcheck_circlecheck_circlecancelcancelcheck_circle
Wiki links[[Page]]cancelcancelcancelcancelcancelcancelcheck_circle
Spec with tests600+ examplescancelcheck_circlecheck_circleadjustadjustcancelcancel
2 spacesHard line breakTwo trailing spaces, or a backslash at line end, make a <br>. A single newline is just a space.
4 spacesIndented codeFour spaces of indent start a code block, which is why nested lists need care.
1.Lists start anywhereA list that starts with 7. renders from 7. Later numbers are ignored, so 1. 1. 1. is fine.
<div>Raw HTML passes throughCommonMark keeps HTML as-is. GitHub filters dangerous tags afterwards; your site must sanitise too.

From Markdown.pl to CommonMark 0.31

2004MarkdownJohn Gruber and Aaron Swartz publish the syntax and Markdown.pl.
2005MultiMarkdownFletcher Penney adds tables, footnotes and metadata.
2006PandocJohn MacFarlane’s converter treats Markdown as one format among dozens.
2009GitHub Flavored MarkdownGitHub adds fenced code, tables and autolinks.
2014CommonMarkA precise spec with a test suite, led by MacFarlane and Jeff Atwood.
2016RFC 7763The text/markdown media type is registered, with a variant parameter.
2017GFM specGitHub publishes GFM as a strict superset of CommonMark.
2024CommonMark 0.31.2The current version of the spec.