마크다운 치트 시트 — 실시간 미리보기가 있는 문법 정리

# 1~6개 뒤에 공백을 넣습니다. 문서당 # 제목은 하나만 쓰고 단계를 건너뛰지 마세요. 스크린 리더와 목차가 이 순서에 의존합니다.

# Heading 1
## Heading 2
### Heading 3
#### Heading 4

예전 "setext" 방식으로 1단계와 2단계만 있습니다. 문단 아래에 --- 줄을 넣으면 제목이 되므로 가로줄을 기대한 사람은 놀랄 수 있습니다. --- 앞에는 빈 줄을 두세요.

Heading 1
=========

Heading 2
---------

빈 줄로 문단을 구분합니다. 문단 안의 줄바꿈 하나는 한 줄로 합쳐집니다(줄바꿈 항목에 적힌 예외 제외).

First paragraph, which can wrap
across several source lines.

Second paragraph after a blank line.

새 문단 없이 줄을 바꾸려면 줄 끝에 공백 두 개나 백슬래시를 넣으세요. GitHub 댓글, Obsidian(기본값), Slack, Discord는 모든 줄바꿈을 그대로 줄바꿈으로 처리합니다.

Two trailing spaces  
make a break.
A trailing backslash\
works too.<br>So does an HTML br.

별표는 단어 안에서도 작동하지만 밑줄은 작동하지 않습니다(snake_case_names는 그대로 유지). 그래서 대부분의 스타일 가이드는 *를 권장합니다.

**bold** or __bold__

*italic* or _italic_

***bold italic***

in**side**word works with *, not with _

각 줄을 >로 시작합니다. 인용문 안에는 목록과 코드를 포함해 어떤 마크다운이든 넣을 수 있습니다.

> Quoted text.
> Still quoted.
>
> > Nested quote.

-, *, + 모두 작동하지만 한 목록 안에서 섞어 쓰지 마세요(다른 기호를 쓰면 새 목록이 시작됨).

- Item
- Item
  - Nested (indent 2 spaces)
- Item

첫 번호가 시작 번호가 되고 이후 번호는 무시됩니다. 그래서 모든 줄에 "1."을 쓰면 항목 순서를 바꿔도 번호가 자동으로 매겨집니다.

1. First
1. Second
1. Third

3. Starts at three
4. Four

추가 내용은 항목 텍스트의 첫 글자에 맞춰 들여 쓰세요("1. " 뒤라면 공백 3개).

1. Install:

   ```sh
   npm install marked
   ```

2. Indent continuation lines
   to the item text.

백틱 안의 마크다운은 해석되지 않습니다.

Run `npm test` now.

Use ``double `backticks` `` when the code contains one.

백틱 세 개(또는 ~~~)를 각각 한 줄에 씁니다. 펜스 뒤의 단어는 언어 이름으로, GitHub, GitLab, Obsidian, Discord에서 구문 강조에 쓰입니다.

```js
const answer = 42;
console.log(answer);
```

const answer = 42;
console.log(answer);

원래의 문법입니다. 펜스가 더 명확하고 언어도 지정할 수 있지만, 구 Reddit은 들여쓰기 코드만 인식합니다.

Paragraph.

    four spaces of indent
    make a code block

four spaces of indent
make a code block

-, *, _를 세 개 이상 한 줄에 단독으로 쓰고, 위에 빈 줄을 둡니다.

Above

---

Below (also *** or ___)

꺾쇠괄호 형식은 CommonMark의 자동 링크입니다. URL의 공백은 %20으로 쓰거나 URL을 <…>로 감싸야 합니다.

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

[With a title](https://freetoolsforweb.com "Hover text")

[Relative link](/tools/regex-cheat-sheet)

<https://example.com>

긴 URL을 본문에서 분리합니다. 정의는 문서 어디에 두어도 되며 화면에 표시되지 않습니다.

Read the [spec][cm] and the [GFM spec].

[cm]: https://spec.commonmark.org/
[GFM spec]: https://github.github.com/gfm/

GitHub와 GitLab에서는 모든 제목에 자동 ID가 붙습니다. 소문자로 바꾸고 공백은 하이픈으로, 문장 부호는 제거합니다("## Install & Run"은 #install--run). Obsidian은 대신 [[#제목]]을 사용합니다.

[Jump to tables](#md-tables)

링크 앞에 !를 붙인 형태입니다. [ ] 안의 텍스트는 대체 텍스트로, 이미지를 볼 수 없는 사람을 위해 이미지를 설명하세요. 마크다운에는 크기 지정 문법이 없으므로 HTML이 허용되는 곳에서는 HTML <img width="200">을 사용하세요.

![Site logo](/brand/favicon.svg "Optional title")

[![Clickable image](/brand/favicon.svg)](/tools)

백슬래시를 붙이면 ASCII 문장 부호를 그대로 표시합니다: \ ` * _ { } [ ] ( ) # + - . ! |

\*not italic\*  \# not a heading  1\. not a list

CommonMark에서 허용됩니다. GitHub와 GitLab은 안전한 일부만 유지하고(script, style, 이벤트 핸들러 제외), Slack, Discord, Reddit, Notion은 텍스트로 표시합니다.

Press <kbd>Ctrl</kbd> + <kbd>C</kbd>, H<sub>2</sub>O, x<sup>2</sup>.

HTML 주석은 소스에는 남지만 HTML이 허용되는 곳에서는 화면에 표시되지 않습니다.

Visible.

<!-- Not rendered: notes for editors -->

Also visible.

두 번째 줄은 필수이며 콜론으로 정렬을 지정합니다. 소스에서 열을 맞출 필요는 없습니다. 파이프 문자는 \|로 이스케이프하세요. 셀 병합이나 여러 줄 셀은 없습니다(GitHub에서는 셀 안에 <br> 사용).

지원: GFM, GitLab, Obsidian, Reddit, Notion(붙여 넣을 때)

| Left | Centre | Right |
| :--- | :----: | ----: |
| a    |   b    |     1 |
| `c`  | **d**  |    22 |

GitHub와 GitLab의 이슈 및 풀 리퀘스트에서는 체크박스를 클릭할 수 있으며 소스도 함께 업데이트됩니다.

지원: GFM, GitLab, Obsidian, Notion([] 단축 입력)

- [x] Write the draft
- [ ] Review
- [ ] Publish

어디서나 물결표 두 개를 쓰며, GitHub는 하나도 허용합니다. Slack은 ~물결표 하나~, Jira는 -하이픈-을 사용합니다.

지원: GFM, GitLab, Obsidian, Discord, Reddit, Notion

~~no longer true~~

GFM은 URL과 www. 주소를 그대로 링크로 바꿉니다. 일반 CommonMark에서는 <…>로 감싸지 않으면 텍스트로 남습니다.

지원: GFM, GitLab, Obsidian, Slack, Discord, Reddit

Visit https://freetoolsforweb.com or www.example.com.

정의는 어디에나 둘 수 있으며, 각주는 참조 순서대로 번호가 매겨져 끝에 나열됩니다. Obsidian에는 인라인 각주 ^[이렇게]도 있습니다.

지원: GFM, GitLab, Obsidian (CommonMark 아님)

Markdown was created in 2004.[^1]

[^1]: By John Gruber, with Aaron Swartz.

앵커를 직접 지정합니다. Pandoc, PHP Markdown Extra, Hugo, Jekyll(kramdown), MkDocs, Docusaurus에서 지원합니다. GitHub와 GitLab은 이를 무시하고 중괄호를 그대로 표시하며 자동 ID를 사용합니다.

지원: Pandoc, Hugo, Jekyll, MkDocs, Docusaurus (GitHub, GitLab 제외)

### Install {#setup}

이름을 콜론으로 감쌉니다. GitHub, Slack, Discord, Notion에서 콜론을 입력하면 이모지 선택기가 열립니다. 이모지 자체를 붙여 넣으면 어디서나 작동합니다.

지원: GitHub, GitLab, Slack, Discord (Obsidian(플러그인 없이)과 CommonMark 제외)

Ship it :rocket: :+1: :tada:

인라인은 $ 기호 사이에, 디스플레이 블록은 $$ 사이에 TeX를 씁니다. GitHub는 $`…`$와 ```math 블록도 지원하며 GitLab도 같은 형식을 지원합니다. Notion은 인라인 수식에 $$…$$를 사용합니다.

지원: GitHub, GitLab, Obsidian, Notion(자체 문법)

Inline: $E = mc^2$

$$
\sum_{i=1}^{n} i = \frac{n(n+1)}{2}
$$

언어를 mermaid로 지정한 코드 블록은 다이어그램이 됩니다. 순서도, 시퀀스, 클래스, 상태, 간트, ER 다이어그램을 그릴 수 있습니다.

지원: GitHub, GitLab, Obsidian, Notion(Mermaid 코드 블록)

```mermaid
flowchart LR
  A[Write] --> B{Review}
  B -->|ok| C[Publish]
  B -->|changes| A
```

GitHub에는 NOTE, TIP, IMPORTANT, WARNING, CAUTION 다섯 가지 유형이 있습니다. GitLab(17.10 이상)도 같은 문법을 지원합니다. Obsidian은 유형이 훨씬 많고 사용자 지정 제목(> [!tip] 제목)과 접기(> [!faq]-)를 지원합니다.

지원: GitHub, GitLab 17.10 이상, Obsidian, 그 밖에서는 일반 인용문

> [!NOTE]
> Useful information.

> [!WARNING]
> Critical content that needs attention.

HTML이지만 널리 지원됩니다. 안쪽 마크다운 앞뒤에 빈 줄을 두지 않으면 해석되지 않습니다.

지원: GitHub, GitLab, Obsidian, 대부분의 정적 사이트 생성기

<details>
<summary>Click to expand</summary>

Hidden **Markdown** content.

</details>

Obsidian과 일부 편집기(Typora, iA Writer)에서 지원하며, GitHub에서는 등호가 그대로 표시됩니다. HTML이 허용되는 곳에서는 <mark>를 사용하세요.

지원: Obsidian, Typora (GitHub 제외)

This is ==highlighted== text.