마크다운 문법 완벽 정리

블로그 글쓰기에 실제로 쓰이는 문법만 · 최종 수정 2026-08-12

왜 마크다운으로 쓰는가

블로그 에디터에서 바로 글을 쓰면 편해 보이지만, 글이 길어질수록 문제가 생깁니다. 어디선가 복사해 온 문단만 글꼴이 다르고, 목록 들여쓰기가 제멋대로 잡히고, 다른 플랫폼에 같은 글을 올리려면 처음부터 다시 서식을 잡아야 합니다.

마크다운은 글의 구조를 텍스트로 기록하는 방식입니다. 제목은 제목이고 목록은 목록이라는 사실만 적어두면, 어떻게 보일지는 나중에 플랫폼에 맞춰 결정하면 됩니다. 한 번 쓴 글을 네이버 블로그에도, 티스토리에도, 회사 위키에도 같은 품질로 올릴 수 있는 이유입니다.

여기서는 문법 전부가 아니라 블로그 글에서 실제로 쓰게 되는 것만 다룹니다. 각 예시는 그대로 복사해서 변환기에 붙여넣어 결과를 바로 확인할 수 있습니다.

제목과 문단

# 개수로 제목 단계를 정합니다. # 뒤에는 반드시 공백이 하나 있어야 합니다.

# 글 제목 (h1)
## 큰 소제목 (h2)
### 작은 소제목 (h3)
#### 더 작은 제목 (h4)

글 하나에 #(h1)은 한 번만 쓰는 것이 좋습니다. 대부분의 블로그는 글 제목을 별도 입력란으로 받기 때문에, 본문에서는 ##부터 시작하는 편이 검색엔진 입장에서도 자연스럽습니다.

문단은 빈 줄 하나로 나눕니다. 그냥 엔터 한 번만 치면 마크다운 표준에서는 같은 문단으로 이어 붙습니다. 다만 한국어 블로그 글은 줄바꿈을 자주 쓰기 때문에, 변환기의 줄바꿈 그대로 반영 옵션을 켜면 엔터 한 번도 그대로 줄바꿈으로 처리됩니다.

강조 — 굵게, 기울임, 취소선

입력결과쓰임
**굵게**굵게핵심 문장, 결론
*기울임*기울임인용된 용어, 강조 아닌 구분
***굵은 기울임***굵은 기울임드물게 사용
~~취소선~~취소선수정 전 내용 남길 때
`인라인 코드`인라인 코드파일명, 명령어, 옵션명
한글에서 자주 겪는 함정**굵게**한글처럼 강조 표시 바로 뒤에 조사가 붙으면 일부 파서가 인식하지 못합니다. **굵게** 뒤에 공백을 넣거나, 조사까지 포함해 **굵게가**로 감싸면 안전합니다.

목록과 체크리스트

순서 없는 목록은 -, 순서 있는 목록은 1.로 시작합니다. 하위 항목은 공백 2칸으로 들여씁니다.

- 첫 번째 항목
- 두 번째 항목
  - 하위 항목
  - 또 다른 하위 항목
- 세 번째 항목

1. 준비하기
2. 실행하기
3. 확인하기

순서 있는 목록의 번호는 전부 1.로 적어도 렌더링할 때 자동으로 매겨집니다. 중간에 항목을 추가할 일이 많다면 이 방식이 편합니다.

체크리스트는 GitHub Flavored Markdown 문법입니다.

- [x] 초안 작성
- [x] 이미지 준비
- [ ] 발행

네이버 블로그와 티스토리 에디터는 붙여넣은 <input type="checkbox"> 태그를 삭제해 버립니다. 그래서 이 변환기는 두 플랫폼에서는 체크박스를 ☑ / ☐ 기호로 바꿔 넣습니다. 발행 후에도 체크 표시가 남아 있게 하려는 처리입니다.

[표시할 글자](https://example.com)
[제목 속성까지](https://example.com "마우스 올리면 보이는 설명")

![대체 텍스트](https://example.com/image.jpg)
<https://example.com>   ← 주소 그대로 링크

이미지 문법은 링크 앞에 !를 붙인 형태입니다. 대괄호 안의 대체 텍스트는 이미지가 안 보일 때 표시되고 검색엔진과 스크린 리더가 읽는 내용이므로, 비워두지 말고 이미지 내용을 짧게 적어주세요.

이미지는 결국 직접 올려야 합니다 — 마크다운의 이미지는 URL 참조일 뿐입니다. 네이버 블로그와 티스토리는 외부 이미지 링크를 차단하거나, 원본 서버가 사라지면 이미지가 통째로 깨집니다. 글 구조는 변환기로 옮기되 이미지는 발행 직전 각 에디터에서 업로드하는 흐름을 권합니다.

인용문

> 인용할 내용을 여기에 씁니다.
> 여러 줄로 이어 쓸 수도 있습니다.
>
> > 인용 안의 인용도 가능합니다.

블로그에서 인용문은 실제 인용뿐 아니라 요약 상자주의 문구로도 자주 쓰입니다. 변환기는 플랫폼별로 왼쪽 세로선과 배경색을 넣어 눈에 띄게 처리합니다.

코드와 코드블록

짧은 코드는 백틱(`) 하나로 감쌉니다. 여러 줄 코드는 백틱 세 개로 감싸고, 첫 줄에 언어 이름을 적으면 문법 강조가 적용됩니다.

```javascript
const post = { title: "첫 글" };
console.log(post.title);
```

자주 쓰는 언어 이름: javascript, typescript, python, java, html, css, sql, bash, json, yaml. 언어를 특정하기 어려우면 비워두면 됩니다.

코드 안에 백틱이 들어가야 한다면, 감싸는 백틱을 하나 더 늘리세요. 백틱 네 개로 감싸면 안쪽의 백틱 세 개를 그대로 보여줄 수 있습니다.

| 항목 | 설명 | 가격 |
| --- | :---: | ---: |
| 기본 | 가운데 정렬 | 0원 |
| 확장 | 컬럼 | 9,900원 |

두 번째 줄의 ---이 머리글과 본문을 나눕니다. 콜론 위치로 정렬을 정합니다. :---은 왼쪽, :---:은 가운데, ---:은 오른쪽 정렬입니다.

표는 모바일에서 가로로 넘칠 수 있으니 열은 4개 이하로, 셀 안의 문장은 짧게 쓰는 편이 좋습니다. 표 안에서는 줄바꿈이 되지 않으므로 긴 설명이 필요하면 <br>을 직접 넣어야 합니다.

구분선·줄바꿈·이스케이프

플랫폼별 지원 범위

문법네이버티스토리벨로그워드프레스
제목 h1~h6
굵게·기울임·취소선
목록·중첩 목록
코드블록 문법 강조△ 색 없이 표시
체크박스△ 기호로 대체△ 기호로 대체
목차 앵커 링크✕ id 제거됨
class 기반 스타일
지금 변환해 보기 위 예시를 그대로 붙여넣고 플랫폼을 바꿔가며 결과를 비교해 보세요.