Markdown 미리보기

Markdown을 작성하고 렌더링된 HTML을 실시간으로 미리보기

Markdown 미리보기에 오신 것을 환영합니다

이것은 실시간 미리보기 편집기입니다. 왼쪽에 입력을 시작하면 오른쪽에 렌더링된 출력이 표시됩니다.

기능

  • 굵게, 기울임꼴, 취소선 텍스트
  • 링크와 이미지
  • 구문 강조가 있는 코드 블록

코드 예제

function greet(name) {
  console.log(`안녕하세요, ${name}님!`);
}
greet("세계");

표 예제

기능상태
GFM 표지원
작업 목록지원
취소선지원

작업 목록

  • Markdown 작성
  • 미리보기 확인
  • HTML로 다운로드

인용 블록도 지원되며 다크 모드에서 멋지게 보입니다.

Markdown 작성을 즐기세요!

Markdown 치트 시트
**굵은 텍스트**굵은 텍스트
*기울인 텍스트*기울인 텍스트
~~취소선~~취소선
# 제목제목(1-6)
[텍스트](url)링크
![대체 텍스트](url)이미지
`코드`인라인 코드
```언어```코드 블록
> 인용인용 블록
- 항목순서 없는 목록
1. 항목순서 있는 목록
---수평선
| a | b |표
- [x] 작업작업 목록

Markdown 미리보기 도구란?

Markdown 미리보기 도구는 왼쪽에서 Markdown을 작성하고 오른쪽에서 렌더링된 출력을 실시간으로 확인할 수 있는 비용 없이 사용할 수 있는 온라인 분할 화면 편집기입니다. 표, 작업 목록, 취소선, 울타리 코드 블록을 포함한 GitHub Flavored Markdown(GFM)을 지원합니다.

GitHub 저장소의 README를 작성하든, 문서나 블로그 게시물을 작성하든, Markdown 구문을 배우든 이 도구는 입력하는 동안 즉각적인 시각적 피드백을 제공합니다.

Markdown 미리보기 편집기 사용 방법

  • 왼쪽 편집기 창에 Markdown 콘텐츠를 입력하거나 붙여넣으세요. 오른쪽 미리보기 창은 입력에 따라 자동으로 업데이트됩니다.
  • 상단 서식 도구 모음을 사용하여 굵게, 기울임꼴, 제목, 링크, 이미지, 코드 블록, 목록을 구문을 외우지 않고 삽입할 수 있습니다.
  • HTML 다운로드 버튼을 클릭하면 렌더링된 출력이 깔끔한 스타일의 독립형 HTML 파일로 다운로드됩니다.
  • 「MD 복사」를 클릭하면 원시 Markdown 텍스트가 클립보드에 복사됩니다.
  • 아래의 Markdown 치트 시트를 펼쳐서 지원되는 모든 구문을 빠르게 참조하세요.

지원하는 Markdown 기능

이 편집기는 완전한 CommonMark 사양과 GitHub Flavored Markdown 확장 기능을 지원합니다. 제목(h1~h6), 굵게, 기울임꼴, 취소선 텍스트, 순서가 있는/없는 목록, 인용 블록, 수평선, 인라인 코드와 울타리 코드 블록, 링크, 이미지, 정렬이 있는 표, 작업 목록 확인란을 사용할 수 있습니다.

더 나은 Markdown을 작성하기 위한 팁

  • 제목은 계층적으로 사용하세요: 제목은 h1, 섹션은 h2, 하위 섹션은 h3
  • 단락 사이와 목록 앞뒤에 빈 줄을 넣어 올바르게 렌더링되도록 하세요.
  • 구문 강조를 지원하는 렌더러에서는 언어 식별자가 있는 울타리 코드 블록을 사용하세요.
  • 서식 문제를 일찍 발견하기 위해 자주 미리보기하세요.
  • 덜 사용하는 요소의 구문을 배우기 위해 도구 모음 버튼을 사용하세요.

일반적인 사용 사례

  • 커밋하기 전에 GitHub README 파일 작성 및 미리보기
  • Markdown으로 문서나 기술 문서 작성
  • Hugo, Jekyll, Astro 등의 정적 사이트 생성기용 블로그 게시물 작성
  • 즉각적인 시각적 피드백으로 Markdown 구문 학습
  • Markdown을 HTML로 변환하여 웹사이트나 이메일에 삽입

자주 묻는 질문

Markdown을 온라인에서 미리볼 수 있나요?+
이 도구의 왼쪽 편집기 창에 Markdown을 붙여넣거나 입력하세요. 렌더링된 미리보기가 오른쪽에 즉시 표시되며 변경 사항에 따라 실시간으로 업데이트됩니다.
이 도구는 GitHub Flavored Markdown을 지원하나요?+
네. 편집기는 표, 확인란이 있는 작업 목록, 취소선 텍스트, 울타리 코드 블록을 포함한 GFM 확장 기능을 완전히 지원합니다. 정확한 렌더링을 위해 remark-gfm 파서를 사용합니다.
Markdown을 HTML로 다운로드할 수 있나요?+
네. 도구 모음의 HTML 다운로드 버튼을 클릭하면 CSS 스타일이 포함된 독립형 HTML 파일이 다운로드됩니다. 파일은 모든 브라우저에서 열거나 웹사이트에 임베드할 수 있습니다.
Markdown에서 표를 어떻게 만드나요?+
파이프(|)로 열을 구분하고 하이픈(-)으로 헤더 행 구분선을 만듭니다. 예: | Column 1 | Column 2 | 다음에 |----------|----------| 그리고 데이터 행을 입력합니다. 미리보기 창에 렌더링된 표가 즉시 표시됩니다.
Markdown과 HTML의 차이점은 무엇인가요?+
Markdown은 HTML보다 읽고 쓰기 쉬운 가벼운 텍스트 서식 구문입니다. 표시를 위해 HTML로 변환됩니다. 이 도구를 사용하면 Markdown으로 작성하면서 생성된 HTML 출력을 나란히 확인할 수 있습니다.
이 편집기를 GitHub README 파일에 사용할 수 있나요?+
물론입니다. 이 편집기는 GitHub에서 사용하는 것과 동일한 GFM 구문을 지원하므로 README도 동일하게 렌더링됩니다. 여기에서 콘텐츠를 작성하고 미리본 다음 Markdown을 저장소에 복사하세요.

관련 도구

글자 수 세기Lorem Ipsum 생성기JSON 포매터정규식 테스터

Markdown 미리보기 — 무료 온라인 markdown 미리보기, markdown 편집기, markdown을 html로, github 플레이버 마크다운, gfm 미리보기, 실시간 markdown 미리보기, markdown 구문, markdown 치트 시트. 회원가입 불필요. 브라우저에서 작동.