📝 개발·블로그 유틸

마크다운 HTML 변환기

마크다운을 입력하면 실시간으로 HTML과 미리보기를 보여 줍니다. 제목·굵게·목록·표·코드블록 등 GFM 문법을 지원하고, 입력한 HTML은 자동으로 이스케이프되어 안전하게 변환됩니다.

🗓️ 최종 업데이트 2026.06.16 ⏱️ 작업 시간 약 10초 🔒 브라우저에서만 처리 · 서버 전송 없음

markdown · GFM · safe HTML

마크다운 → HTML 실시간 변환

왼쪽에 마크다운을 입력하면 오른쪽에 미리보기와 HTML 소스가 즉시 표시됩니다.

대기

왼쪽 입력창에 마크다운을 작성하면 오른쪽 미리보기와 HTML 소스가 실시간으로 갱신됩니다. 입력 HTML은 자동 이스케이프됩니다.

마크다운을 입력하세요.

마크다운 입력

마크다운 미리보기 예시

Toolvil에서 마크다운을 실시간으로 변환합니다.

제목, 굵게, 기울임
링크 Toolvil과 인라인 코드
표·코드블록·인용문 지원

> 입력한 HTML은 자동으로 이스케이프되어 안전합니다.

const hi = "world";

<h2>마크다운 미리보기 예시</h2>
<p><strong>Toolvil</strong>에서 마크다운을 <em>실시간</em>으로 변환합니다.</p>
<ul><li>제목, 굵게, 기울임</li><li>링크 <a href="https://toolvil.com">Toolvil</a>과 <code>인라인 코드</code></li><li>표·코드블록·인용문 지원</li></ul>
<p>&gt; 입력한 HTML은 자동으로 이스케이프되어 안전합니다.</p>
<pre><code class="language-js">const hi = &quot;world&quot;;</code></pre>

입력 통계가 여기에 표시됩니다.

마크다운 입력 후 HTML과 미리보기를 표시합니다.

지원 문법 제목·굵게·목록·표·코드블록·인용·링크 (GFM 서브셋)

안전 변환 입력 HTML 자동 이스케이프 · 위험 링크 스킴 차단

처리 위치 서버 전송 없이 현재 브라우저에서 변환

마크다운 HTML 변환기 사용 가이드

마크다운은 README·블로그·문서 작성에 널리 쓰이는 경량 마크업 문법입니다. 마크다운 HTML 변환기는 입력한 마크다운을 표준 HTML로 변환하고 실시간 미리보기를 함께 보여 주는 도구입니다. 제목, 굵게/기울임, 순서·비순서 목록, 표, 코드블록, 인용문, 링크 등 GitHub Flavored Markdown(GFM)의 핵심 문법을 지원하며, 변환 결과를 블로그·노션·CMS에 바로 붙여넣을 수 있습니다.

무엇보다 이 변환기는 안전합니다. 입력의 모든 HTML 특수문자를 자동으로 이스케이프하므로 <script> 같은 코드가 실행되지 않고 텍스트로 표시되며, javascript: 같은 위험한 링크 스킴은 자동 차단됩니다. 모든 처리는 현재 브라우저에서만 이루어지며 입력한 문서를 서버로 전송하지 않습니다.

이 도구가 필요한 경우

README·블로그 글을 마크다운으로 쓰고 HTML로 변환해 게시할 때
마크다운이 어떻게 렌더링되는지 실시간으로 확인하고 싶을 때
신뢰할 수 없는 마크다운을 안전하게 HTML로 바꿔야 할 때

지원하는 문법

제목(#~######), 굵게(**), 기울임(*), 취소선(~~)
목록(-/1.), 작업 목록([ ]/[x]), 인용문(>), 구분선(---)
링크·이미지, 인라인 코드(`), 코드블록(```), 표(|)

사용 방법

왼쪽 입력창에 마크다운을 작성하거나 붙여넣습니다.
오른쪽 미리보기에서 렌더링 결과를 실시간으로 확인합니다.
'HTML 소스' 탭으로 전환해 변환된 HTML 코드를 봅니다.
'HTML 복사' 버튼으로 결과를 클립보드에 복사합니다.
블로그·노션·CMS 등 원하는 곳에 붙여넣습니다.

입력값마크다운 텍스트 (브라우저에서만 처리)

출력값표준 HTML 소스와 실시간 미리보기, 글자수 통계

지원 문법제목·강조·목록·작업목록·표·코드블록·인용·링크·이미지(GFM)

보안입력 HTML 자동 이스케이프, javascript:/data: 스킴 차단

처리 위치브라우저 로컬 처리 · 서버 전송 없음

안전한 변환의 원리

일반적인 마크다운 변환기는 입력에 포함된 원시 HTML을 그대로 통과시켜 스크립트 주입(XSS) 위험이 있습니다. 이 변환기는 변환 전에 모든 HTML 특수문자(< > & ")를 이스케이프한 뒤 마크다운 문법만 HTML로 바꾸기 때문에, 신뢰할 수 없는 문서를 변환해도 코드가 실행되지 않습니다. 링크·이미지의 주소도 위험한 스킴을 차단해 결과를 더 안전하게 게시할 수 있습니다.

출처와 검토 기준

변환 규칙은 CommonMark·GitHub Flavored Markdown(GFM)의 핵심 문법을 참고한 자체 구현으로, 외부 라이브러리나 서버에 의존하지 않습니다. 복잡한 중첩 구조나 일부 확장 문법은 단순화될 수 있으니 결과 HTML을 확인하세요. 변환 로직은 2026-06-16에 검토했고 golden 테스트(MD-001..004)로 대표 입력과 보안 케이스를 고정했습니다.

이 변환기는 GFM 핵심 문법의 안전한 서브셋을 구현하며, 원시 HTML 통과·스크립트 실행은 보안을 위해 지원하지 않습니다. 복잡한 문서는 결과 HTML을 검토 후 사용하세요.

FAQ

어떤 마크다운 문법을 지원하나요?

제목(#~######), 굵게/기울임/취소선, 인라인 코드와 코드블록(```), 순서·비순서 목록과 작업 목록([ ]/[x]), 표(GFM table), 인용문(>), 구분선, 링크·이미지 등 GitHub Flavored Markdown의 핵심 문법을 지원합니다.

입력한 HTML이나 스크립트가 그대로 실행되나요?

아니요. 보안을 위해 입력의 모든 HTML 특수문자를 자동으로 이스케이프합니다. <script>를 넣어도 코드로 실행되지 않고 텍스트로 표시되므로, 신뢰할 수 없는 문서를 변환해도 안전합니다.

변환된 HTML을 블로그나 CMS에 바로 붙여넣을 수 있나요?

네. 'HTML 소스' 탭의 결과를 복사해 블로그·노션·CMS에 붙여넣으면 됩니다. 표준 HTML 태그(h1·p·ul·table·pre 등)로 출력되므로 대부분의 에디터와 호환됩니다.

마크다운 링크에 javascript: 같은 위험한 주소를 넣으면 어떻게 되나요?

javascript:·vbscript:·data: 같은 위험한 스킴의 링크·이미지 주소는 자동으로 '#'으로 차단됩니다. 변환 결과를 그대로 게시해도 스크립트 주입 위험이 줄어듭니다.

입력한 문서가 서버로 전송되나요?

아니요. 변환은 100% 현재 브라우저에서 이루어지며 입력한 마크다운을 서버로 전송하거나 저장하지 않습니다. 새로고침하면 입력값은 사라집니다.