Cheatsheets:Markdown: Difference between revisions
Create Markdown cheatsheet imitating Cheatsheets:SPARQL (via create-page on MediaWiki MCP Server) |
Rework per review: browser-content renderings, GFM moved to dedicated section, legacy indented-code note (via update-page on MediaWiki MCP Server) |
||
| Line 3: | Line 3: | ||
<blockquote> | <blockquote> | ||
Markdown is plain text with a few markers that a renderer turns into HTML. This | Markdown is plain text with a few markers that a renderer turns into HTML. This | ||
page is a syntax reference for '''CommonMark''', the standard | page is a syntax reference for '''CommonMark''', the standard. GitHub Flavored | ||
Markdown (GFM) extensions are covered in the [[#GFM extensions|GFM extensions]] | |||
section. | |||
New to Markdown? Work through the | New to Markdown? Work through the | ||
| Line 51: | Line 52: | ||
</ol> | </ol> | ||
</syntaxhighlight> | </syntaxhighlight> | ||
Rendered in the browser (the HTML above as a browser displays it): | |||
<blockquote> | |||
<p style="font-size:2em;font-weight:bold;">Pancakes</p> | |||
<p>A quick pancake recipe for two.</p> | |||
<p style="font-size:1.5em;font-weight:bold;">Ingredients</p> | |||
<ul> | |||
<li>150 g flour</li> | |||
<li>250 ml milk</li> | |||
</ul> | |||
<p style="font-size:1.5em;font-weight:bold;">Steps</p> | |||
<ol> | |||
<li>Mix the flour and milk.</li> | |||
<li>Cook the batter in a pan.</li> | |||
</ol> | |||
</blockquote> | |||
== Paragraphs and line breaks == | == Paragraphs and line breaks == | ||
| Line 67: | Line 85: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
Rendered: | |||
<blockquote>line one line two</blockquote> | <blockquote>line one line two</blockquote> | ||
|| | || | ||
| Line 75: | Line 93: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
Rendered: | |||
<blockquote>line one<br/>line two</blockquote> | <blockquote>line one<br/>line two</blockquote> | ||
|} | |} | ||
| Line 81: | Line 99: | ||
== Headings == | == Headings == | ||
One to six <syntaxhighlight lang="markdown" inline>#</syntaxhighlight> markers set the level | One to six <syntaxhighlight lang="markdown" inline>#</syntaxhighlight> markers set the level. | ||
{| class="wikitable" | {| class="wikitable" | ||
| Line 95: | Line 113: | ||
|- | |- | ||
| <syntaxhighlight lang="markdown" inline>Ingredients</syntaxhighlight> + <syntaxhighlight lang="markdown" inline>---</syntaxhighlight> on the next line || h2 (setext) | | <syntaxhighlight lang="markdown" inline>Ingredients</syntaxhighlight> + <syntaxhighlight lang="markdown" inline>---</syntaxhighlight> on the next line || h2 (setext) | ||
|} | |||
A space between the last marker and the text is required: | |||
{| class="wikitable" | |||
! Wrong (no space) !! Right | |||
|- | |||
| | |||
<syntaxhighlight lang="markdown"> | |||
#Pancakes | |||
</syntaxhighlight> | |||
Rendered: the line stays a paragraph and the <syntaxhighlight lang="text" inline>#</syntaxhighlight> is literal: | |||
<blockquote>#Pancakes</blockquote> | |||
|| | |||
<syntaxhighlight lang="markdown"> | |||
# Pancakes | |||
</syntaxhighlight> | |||
Rendered: a level-1 heading: | |||
<blockquote> | |||
<p style="font-size:2em;font-weight:bold;">Pancakes</p> | |||
</blockquote> | |||
|} | |} | ||
| Line 107: | Line 148: | ||
|- | |- | ||
| <syntaxhighlight lang="markdown" inline>***both***</syntaxhighlight> || <em><strong>both</strong></em> | | <syntaxhighlight lang="markdown" inline>***both***</syntaxhighlight> || <em><strong>both</strong></em> | ||
|} | |} | ||
| Line 120: | Line 159: | ||
| <syntaxhighlight lang="markdown" inline>[CommonMark](https://commonmark.org)</syntaxhighlight> || [https://commonmark.org CommonMark] | | <syntaxhighlight lang="markdown" inline>[CommonMark](https://commonmark.org)</syntaxhighlight> || [https://commonmark.org CommonMark] | ||
|- | |- | ||
| <syntaxhighlight lang="markdown" inline></syntaxhighlight> || | | <syntaxhighlight lang="markdown" inline></syntaxhighlight> || [[File:Example.png|alt=alt text|150px]] | ||
|- | |- | ||
| <syntaxhighlight lang="markdown" inline>[CommonMark][cm]</syntaxhighlight> with <syntaxhighlight lang="markdown" inline>[cm]: https://commonmark.org</syntaxhighlight> later || reference-style link | | <syntaxhighlight lang="markdown" inline>[CommonMark][cm]</syntaxhighlight> with <syntaxhighlight lang="markdown" inline>[cm]: https://commonmark.org</syntaxhighlight> later || reference-style link | ||
| Line 136: | Line 175: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
Rendered | Rendered: | ||
< | <blockquote> | ||
<ul> | <ul> | ||
<li>fruit | <li>fruit | ||
| Line 147: | Line 186: | ||
<li>veg</li> | <li>veg</li> | ||
</ul> | </ul> | ||
</ | </blockquote> | ||
A blank line between items makes a '''loose''' list: each item is wrapped in a paragraph. | A blank line between items makes a '''loose''' list: each item is wrapped in a paragraph. | ||
== Code == | == Code == | ||
| Line 187: | Line 210: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
Rendered: | |||
<syntaxhighlight lang=" | <syntaxhighlight lang="python"> | ||
print("hi") | |||
</syntaxhighlight> | </syntaxhighlight> | ||
<blockquote> | |||
'''Legacy syntax:''' indented code blocks. Four leading spaces also produce a | |||
code block, without highlighting. This form is '''not recommended''' — it is | |||
easy to break (a blank line ends it, and the indentation must change inside | |||
lists). You may still see it in older documents; use fenced blocks instead. | |||
</blockquote> | |||
== Blockquotes == | == Blockquotes == | ||
| Line 203: | Line 233: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
Rendered: | |||
<blockquote> | <blockquote> | ||
| Line 211: | Line 241: | ||
</blockquote> | </blockquote> | ||
== | == GFM extensions == | ||
GFM (GitHub Flavored Markdown) is CommonMark plus the extensions below, used on | |||
GitHub. | |||
'''Strikethrough''' — two tildes: | |||
{| class="wikitable" | |||
! Source !! Rendered | |||
|- | |||
| <syntaxhighlight lang="markdown" inline>~~struck~~</syntaxhighlight> || <del>struck</del> | |||
|} | |||
'''Tables''' — a header row, a separator row of dashes, then body rows. Colons | |||
in the separator row set alignment: | |||
<syntaxhighlight lang="markdown"> | <syntaxhighlight lang="markdown"> | ||
| Line 221: | Line 263: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
Rendered: the first column is left-, the second center- and the third | |||
right-aligned: | |||
<blockquote> | |||
<table> | |||
<tr><th style="text-align: left;">Left</th><th style="text-align: center;">Center</th><th style="text-align: right;">Right</th></tr> | |||
<tr><td style="text-align: left;">a</td><td style="text-align: center;">b</td><td style="text-align: right;">c</td></tr> | |||
</table> | |||
</blockquote> | |||
'''Task lists''' — <syntaxhighlight lang="markdown" inline>- [ ]</syntaxhighlight> and <syntaxhighlight lang="markdown" inline>- [x]</syntaxhighlight> render as checkboxes: | |||
<syntaxhighlight lang="markdown"> | |||
- [x] mix the batter | |||
- [ ] cook the pancakes | |||
</syntaxhighlight> | |||
Rendered: | |||
<blockquote> | |||
☑ mix the batter<br/> | |||
☐ cook the pancakes | |||
</blockquote> | |||
(The glyphs stand in for checkboxes; a GFM renderer produces clickable | |||
checkboxes.) | |||
== Escaping == | == Escaping == | ||
| Line 260: | Line 327: | ||
*bold?* yes | *bold?* yes | ||
</syntaxhighlight> | </syntaxhighlight> | ||
</blockquote> | </blockquote> | ||
Revision as of 15:07, 19 August 2026
Quick reference for smart people — part of our dev cheatsheets collection.
Markdown is plain text with a few markers that a renderer turns into HTML. This page is a syntax reference for CommonMark, the standard. GitHub Flavored Markdown (GFM) extensions are covered in the GFM extensions section.
New to Markdown? Work through the CommonMark interactive tutorial first, then come back to look things up.
The running example throughout this page is a short pancake recipe.
Basic example
A recipe: one heading, one paragraph, an unordered and an ordered list.
Markdown source:
# Pancakes
A quick pancake recipe for two.
## Ingredients
- 150 g flour
- 250 ml milk
## Steps
1. Mix the flour and milk.
2. Cook the batter in a pan.
Rendered (HTML, as a CommonMark renderer produces it):
<h1>Pancakes</h1>
<p>A quick pancake recipe for two.</p>
<h2>Ingredients</h2>
<ul>
<li>150 g flour</li>
<li>250 ml milk</li>
</ul>
<h2>Steps</h2>
<ol type="1">
<li>Mix the flour and milk.</li>
<li>Cook the batter in a pan.</li>
</ol>
Rendered in the browser (the HTML above as a browser displays it):
Pancakes
A quick pancake recipe for two.
Ingredients
- 150 g flour
- 250 ml milk
Steps
- Mix the flour and milk.
- Cook the batter in a pan.
Paragraphs and line breaks
- A blank line separates paragraphs.
- A single newline is a soft wrap: it becomes a space.
- A backslash at the end of a line (or two trailing spaces) forces a hard break.
| Without (soft wrap) | With hard break |
|---|---|
line one
line two
Rendered:
|
line one\
line two
Rendered:
|
Headings
One to six # markers set the level.
| Source | Level |
|---|---|
# Pancakes |
h1 |
## Ingredients |
h2 |
###### Note |
h6 |
Pancakes + === on the next line |
h1 (setext) |
Ingredients + --- on the next line |
h2 (setext) |
A space between the last marker and the text is required:
| Wrong (no space) | Right |
|---|---|
#Pancakes
Rendered: the line stays a paragraph and the
|
# Pancakes
Rendered: a level-1 heading:
|
Emphasis
| Source | Rendered |
|---|---|
*italic* or _italic_ |
italic |
**bold** or __bold__ |
bold |
***both*** |
both |
Links and images
Inline links take the form [text](URL); images add a ! and an alt text: .
| Source | Rendered |
|---|---|
[CommonMark](https://commonmark.org) |
CommonMark |
 |
|
[CommonMark][cm] with [cm]: https://commonmark.org later |
reference-style link |
Lists
Unordered markers -, * and + are interchangeable. Ordered lists number from the first item's number, whatever you write. Nest with an indentation:
- fruit
- apple
- pear
- veg
Rendered:
- fruit
- apple
- pear
- veg
A blank line between items makes a loose list: each item is wrapped in a paragraph.
Code
Inline code — backticks; when the code itself contains a backtick, use two backticks:
| Source | Rendered |
|---|---|
`pip install markdown` |
pip install markdown
|
`` `expr` `` |
`expr`
|
Fenced blocks — three backticks; the word after the opening fence enables syntax highlighting:
```python
print("hi")
```
Rendered:
print("hi")
Legacy syntax: indented code blocks. Four leading spaces also produce a code block, without highlighting. This form is not recommended — it is easy to break (a blank line ends it, and the indentation must change inside lists). You may still see it in older documents; use fenced blocks instead.
Blockquotes
A line starting with > is a blockquote; >> nests. An empty > keeps paragraphs separate inside the quote.
> quoted line
>
> second quoted line
Rendered:
quoted line
second quoted line
GFM extensions
GFM (GitHub Flavored Markdown) is CommonMark plus the extensions below, used on GitHub.
Strikethrough — two tildes:
| Source | Rendered |
|---|---|
~~struck~~ |
Tables — a header row, a separator row of dashes, then body rows. Colons in the separator row set alignment:
| Left | Center | Right |
|:-----|:------:|------:|
| a | b | c |
Rendered: the first column is left-, the second center- and the third right-aligned:
Left Center Right a b c
Task lists — - [ ] and - [x] render as checkboxes:
- [x] mix the batter
- [ ] cook the pancakes
Rendered:
☑ mix the batter
☐ cook the pancakes
(The glyphs stand in for checkboxes; a GFM renderer produces clickable checkboxes.)
Escaping
A backslash makes the next character literal:
| Source | Rendered |
|---|---|
\*not italic\* |
*not italic* |
\# not a heading |
# not a heading |
Gotcha: emphasis needs word boundaries — underscores inside a word are literal, not emphasis.
Source
foo_bar_bazrenders as foo_bar_baz, not as "foobarbaz". Fix: use asterisks around whole words instead:*foo bar* baz
Gotcha: Markdown inside an HTML block is not parsed — raw HTML passes through untouched.
<div> *bold?* no, raw </div>renders the
*bold?*literally. Fix: don't wrap Markdown in raw HTML at all:*bold?* yes
Further reading
- CommonMark spec — the official standard
- CommonMark interactive tutorial — the recommended tutorial
- GFM spec — tables, task lists, strikethrough
- Markdown Guide — a friendly reference