Markdown is one of those tools where most developers know 70% of it and then look up the other 30% every time. This is the reference I wish I had when I started — covering the elements that come up in real work, with examples you can copy.
Basic formatting
**Bold text**
__Also bold__
*Italic text*
_Also italic_
***Bold and italic***
~~Strikethrough~~
`Inline code`
Output:
Bold text, Italic text, Bold and italic, Strikethrough, inline code
Headings
# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6
Note: Always put a space after the # characters. #Heading may not render correctly in some parsers.
Links and images
[Link text](https://example.com)
[Link with title](https://example.com "Tooltip text")
<!-- Reference-style links -->
[link text][reference-id]
[reference-id]: https://example.com "Optional title"
Lists
Unordered lists — use -, *, or + (consistently):
- Item one
- Item two
- Nested item (indent with 2 spaces)
- Another nested item
- Item three
Ordered lists:
1. First item
2. Second item
1. Nested numbered item
2. Another nested item
3. Third item
Note: The actual numbers don't matter — 1. 1. 1. renders as 1. 2. 3. — but using correct numbers makes the raw text more readable.
Blockquotes
> This is a blockquote.
> It can span multiple lines.
>
> And have multiple paragraphs.
>
> > Nested blockquote
Code blocks
Inline code:
Use `console.log()` to debug.
Fenced code block (recommended):
```
javascript
function add(a, b) {
return a + b;
}
```
```
`
**Indented code block (4 spaces):**
```markdown
// 4 spaces indent = code block
function add(a, b) {
return a + b;
}
```
Use fenced code blocks — they support syntax highlighting and are easier to read in raw form.
**Supported language identifiers** (for syntax highlighting):
`javascript`, `typescript`, `python`, `ruby`, `go`, `rust`, `java`, `kotlin`, `swift`, `cpp`, `c`, `cs`, `php`, `bash`, `shell`, `sql`, `html`, `css`, `scss`, `json`, `yaml`, `toml`, `xml`, `markdown`, `dockerfile`, `graphql`
---
## Horizontal rules
Any of these produce a horizontal line:
```markdown
---
***
___
```
Note: `---` on its own line also triggers "Setext-style" heading syntax if preceded by text. Add a blank line before `---` if it's a horizontal rule, not a heading separator.
---
## Tables (GitHub Flavored Markdown)
```markdown
| Column 1 | Column 2 | Column 3 |
| -------- | -------- | -------- |
| Cell 1 | Cell 2 | Cell 3 |
| Cell 4 | Cell 5 | Cell 6 |
```
**Column alignment:**
```markdown
| Left | Center | Right |
| :------- | :------: | -------: |
| left | center | right |
```
Rules:
- The header separator row (`| --- |`) is required
- Cells don't need to line up (but it helps readability)
- You need at least three dashes per column
---
## Task lists (GitHub Flavored Markdown)
```markdown
- [x] Completed task
- [ ] Incomplete task
- [x] Another completed task
```
Renders as interactive checkboxes on GitHub and supported platforms.
---
## Footnotes (extended Markdown)
```markdown
Here is a claim.[^1]
[^1]: This is the footnote.
```
Supported on GitHub, Obsidian, and most modern Markdown renderers. Not part of the original spec.
---
## HTML in Markdown
Most Markdown parsers allow raw HTML inline:
```markdown
This paragraph has <strong>bold</strong> and <em>italic</em> HTML.
<div style="color: red;">
This is a red div.
</div>
```
Useful for elements Markdown doesn't support: `<kbd>`, `<sub>`, `<sup>`, `<details>/<summary>`, `<br>`.
```markdown
Press <kbd>Ctrl</kbd>+<kbd>C</kbd> to copy.
H<sub>2</sub>O and x<sup>2</sup>
<details>
<summary>Click to expand</summary>
Hidden content here.
</details>
```
---
## Escaping characters
To display a character that would be interpreted as Markdown syntax, escape it with a backslash:
```markdown
\*Not italic\*
\# Not a heading
\[Not a link\]
\`Not code\`
```
---
## Line breaks
A regular line break in source doesn't create a new paragraph:
```markdown
Line one
Line two (renders as one paragraph)
```
To force a line break without a new paragraph, end a line with two spaces or use `<br>`:
```markdown
Line one
Line two (two spaces at end = line break)
```
To create a new paragraph, use a blank line between blocks.
---
## Markdown to HTML
When you need to see the rendered output or convert Markdown to HTML for a CMS or email template, the [Markdown to HTML Converter at SnappyTools](https://snappytools.app/markdown-to-html/) gives you a live split-pane editor with GitHub Flavored Markdown support. You can toggle GFM on/off, copy the raw HTML output, and test tables and task lists directly in the browser.
---
## Quick reference
| Element | Syntax |
|---|---|
| Heading | `# H1` `## H2` `### H3` |
| Bold | `**text**` or `__text__` |
| Italic | `*text*` or `_text_` |
| Strikethrough | `~~text~~` |
| Inline code | `` `code` `` |
| Code block | `
``` ```
lang
``` ```
` |
| Link | `[text](url)` |
| Image | `` |
| Blockquote | `> quote` |
| Unordered list | `- item` |
| Ordered list | `1. item` |
| Table | `\| col \| col \|` |
| Task list | `- [x] done` |
| Horizontal rule | `---` |
| Line break | Two spaces at end of line |
Top comments (0)