Back to Editor

Markdown Syntax Guide

Markdown Document
Reading time about 3 minutes

Markdown Syntax Guide

Headers

# H1 - Heading 1
## H2 - Heading 2
### H3 - Heading 3
#### H4 - Heading 4
##### H5 - Heading 5
###### H6 - Heading 6

Alternative syntax for H1 and H2:
=================================

Alternative syntax for H2:
---------------------------------

Emphasis

*Italic text* or _Italic text_

**Bold text** or __Bold text__

***Bold and italic*** or ___Bold and italic___

~~Strikethrough~~

==Highlight== (not supported in all Markdown processors)

Lists

Unordered Lists

- First item
- Second item
  - Nested item
  - Another nested item
    - Double nested item
* Another list item
+ Yet another item

Ordered Lists

1. First item
2. Second item
   1. Nested item
   2. Another nested item
3. Third item

Automatic numbering:
1. First item
1. Second item
1. Third item

Mixed Lists

1. First item
2. Second item
   - Unordered sub-item
   - Another unordered sub-item
3. Third item
   1. Ordered sub-item
   2. Another ordered sub-item

Links

[Link text](https://example.com)

[Link with title](https://example.com "Link title")

[Relative link](../folder/file.md)

[Reference link][1]

[1]: https://example.com

Auto-converted link: https://example.com

[Link to heading](#headers)

[Nested link syntax](https://example.com "Visit [Example](https://example.com)")

[Email link](mailto:[email protected])

Images

![Alt text](image.jpg)

![Alt text](image.jpg "Image title")

![Alt text](../images/image.png)

![Reference image][image-ref]

[image-ref]: images/photo.png

[![Image as link](thumbnail.jpg)](full-size.jpg)

Code

Inline Code

Use the `printf()` function.

``Use `code` inside code``

The `<html>` tag

Code Blocks

```
This is a code block
with multiple lines
```

```javascript
function hello() {
    console.log("Hello, world!");
}
```

```python
def hello():
    print("Hello, world!")
```

    This is an indented code block
    Each line starts with 4 spaces

Blockquotes

> This is a blockquote

> This is a blockquote
> with multiple lines

> This is a blockquote
>> With nested blockquote
> Back to first level

> ## This is a header in a blockquote
> 
> - List item
> - Another list item
> 
> ```javascript
> console.log("Code in blockquote");
> ```

Horizontal Rule

---

***

___

- - -

* * *

_ _ _

Tables

| Column 1 | Column 2 | Column 3 |
|----------|----------|----------|
| Cell 1   | Cell 2   | Cell 3   |
| Cell 4   | Cell 5   | Cell 6   |

| Left-aligned | Center-aligned | Right-aligned |
|:-------------|:--------------:|--------------:|
| Cell 1       |    Cell 2      |        Cell 3 |
| Cell 4       |    Cell 5      |        Cell 6 |

| Column 1 | Column 2 |
|----------|----------|
| Cell 1   | Cell 2   |
| Cell 3 has a lot of content | Cell 4 |

Task Lists

- [x] Completed task
- [ ] Incomplete task
- [ ] Another incomplete task
  - [x] Nested completed task
  - [ ] Nested incomplete task

1. [x] First completed item
2. [ ] Second incomplete item

Footnotes

This is a sentence with a footnote.[^1]

This is another sentence with a different footnote.[^2]

[^1]: This is the first footnote content.

[^2]: This is the second footnote content.
    It can span multiple lines.

Definition Lists

Term 1
:   Definition 1

Term 2
:   Definition 2
    Second paragraph of definition 2

Term 3
:   Definition 3

    Multiple paragraphs in definition 3

Abbreviations

*[HTML]: Hyper Text Markup Language
*[W3C]: World Wide Web Consortium

The HTML specification is maintained by the W3C.

Emojis

:smile: :heart: :thumbsup: :rocket: :tada:

😀 ❤️ 👍 🚀 🎉

:fire: :star: :sparkles: :zap: :bulb:

Escaping Characters

\* This is not italic \*

\> This is not a blockquote

\# This is not a header

\[This is not a link](https://example.com)

\!\[This is not an image](image.jpg)

\`This is not code`

\\ This shows a backslash

\{\} These are not curly braces in some contexts

Special Characters to Escape

The following characters can be escaped with a backslash:

  • \ backslash
  • ` backtick
  • * asterisk
  • _ underscore
  • {} curly braces
  • [] square brackets
  • () parentheses
  • # hash mark
  • + plus sign
  • - minus sign (hyphen)
  • . dot
  • ! exclamation mark
  • | pipe

Line Breaks

First line  
Second line (two spaces at end)

First line
Second line (empty line between)

First line<br>
Second line (HTML break tag)

Comments

[//]: # (This is a comment)

[comment]: # (This is also a comment)

<!-- HTML comment -->

HTML in Markdown

<div class="custom-class">
    <p>This is HTML inside Markdown</p>
</div>

<span style="color: red;">Red text</span>

<details>
<summary>Click to expand</summary>
<p>Hidden content</p>
</details>

YAML Front Matter

---
title: Document Title
author: John Doe
date: 2023-01-01
tags: [markdown, syntax, guide]
---

# Document Content

Math (LaTeX)

Inline math: $E = mc^2$

Block math:
$$
\int_{0}^{\infty} e^{-x^2} dx = \frac{\sqrt{\pi}}{2}
$$

Another block math:
$$
\begin{align}
x &= y + z \\
y &= a \times b
\end{align}
$$

Mermaid Diagrams

```mermaid
graph TD
    A[Start] --> B{Decision}
    B -->|Yes| C[Result 1]
    B -->|No| D[Result 2]
```

```mermaid
sequenceDiagram
    participant A as Alice
    participant B as Bob
    A->>B: Hello Bob
    B-->>A: Hello Alice
```

Admonitions (Note/Warn/Tip)

!!! note
    This is a note

!!! warning
    This is a warning

!!! tip
    This is a tip

??? info
    This is a collapsible info box
📋 Document Outline