MDMarkdown ↔ HTML 변환기
Markdown은 일반 텍스트로 서식이 있는 문서를 작성하기 위한 경량 마크업 언어입니다. GitHub README, 기술 블로그, Notion, 위키 등 다양한 플랫폼에서 사용되며, 최종적으로는 HTML로 렌더링됩니다. 반대로 기존 HTML 문서나 웹 페이지를 Markdown으로 변환하면 버전 관리나 문서화에 더 적합한 형식으로 바꿀 수 있습니다. 이 도구는 두 형식 간 양방향 변환을 지원하며, GFM(GitHub Flavored Markdown) 표·체크박스, KaTeX 수식, HTML 출력 포맷 선택 등 실무에서 필요한 옵션을 함께 제공합니다.
사용 방법
- 1변환 방향 선택
상단에서 'Markdown → HTML' 또는 'HTML → Markdown' 모드를 선택합니다. 모드를 전환해도 입력 내용은 유지됩니다.
- 2옵션 설정
Markdown → HTML 모드에서는 HTML 출력 형식(Pretty·Minify·Raw), GFM(표·체크박스) 활성화, KaTeX 수식 렌더링을 선택할 수 있습니다. HTML → Markdown 모드에서는 Heading 스타일(ATX·Setext), Bullet 기호(-, *, +), 코드 블록 스타일(Fenced·Indented), 그리고 HTML 태그를 그대로 유지할 목록(Keep Tags)을 설정할 수 있습니다.
- 3입력 및 결과 확인
왼쪽 입력 영역에 텍스트를 붙여넣거나 '예제 로드' 버튼으로 샘플을 불러옵니다. 250ms 디바운스 후 변환이 자동으로 실행되어 오른쪽에 결과가 표시됩니다.
- 4미리보기 활용
하단 미리보기 영역에서 실제 렌더링 결과를 확인합니다. Markdown → HTML 모드에서는 변환된 HTML이, HTML → Markdown 모드에서는 변환된 Markdown의 HTML 렌더링이 표시됩니다.
- 5결과 복사
결과 영역의 복사 버튼을 클릭하면 변환된 텍스트가 클립보드에 복사됩니다.
활용 팁
- 💡GitHub README 파일을 작성할 때 Markdown → HTML로 변환하면 실제 렌더링 결과를 Push 전에 미리 확인할 수 있습니다.
- 💡블로그 플랫폼(티스토리, 워드프레스 등)에서 HTML로 작성한 글을 Markdown으로 변환하면 이후 관리가 훨씬 편해집니다.
- 💡KaTeX 수식은 $인라인 수식$ 또는 $$블록 수식$$ 문법을 지원합니다. 예: $E=mc^2$
- 💡GFM 표 문법(| 컬럼 | 컬럼 |)을 사용하면 HTML → Markdown 변환 시 자동으로 Markdown 표로 변환됩니다.
- 💡HTML → Markdown 변환 시 'Keep Tags'에 유지하고 싶은 HTML 태그를 콤마로 구분하여 입력하면 해당 태그는 Markdown으로 변환되지 않고 그대로 보존됩니다.
- 💡Pretty 출력은 들여쓰기가 적용된 읽기 좋은 HTML을, Minify는 공백 제거 후 최소화된 HTML을, Raw는 marked 라이브러리가 생성한 원본 그대로를 출력합니다.