본문으로 건너뛰기

무료 Markdown 표 생성기

열별 정렬을 사용하여 Markdown 표를 시각적으로 편집합니다. CSV 또는 TSV에서 가져오고, GitHub Flavored Markdown 출력을 복사합니다.

한 번 로드하면 오프라인에서도 작동
CSV, TSV 또는 Markdown에서 가져오기
미리보기
이름이메일역할
Alicealice@example.com관리자
Bobbob@example.com편집자
Carolcarol@example.com뷰어
| 이름    | 이메일               | 역할  |
| :---- | :---------------- | :-: |
| Alice | alice@example.com | 관리자 |
| Bob   | bob@example.com   | 편집자 |
| Carol | carol@example.com | 뷰어  |

주요 용도

  • GitHub README 파일용 테이블 만들기GitHub는 Markdown 테이블을 기본적으로 렌더링합니다. 기능 비교 테이블, API 참고 또는 로드맵을 시각적으로 만듭니다.
  • API 및 참고 설명서 테이블API 설명서용 매개변수 테이블, 상태 코드 참고 및 필드 정의 테이블을 만듭니다.
  • Obsidian / Notion / Logseq에서 테이블 만들기Markdown 기반 노트 앱은 모두 테이블을 지원합니다. 일반 텍스트보다 여기서 빠르게 만듭니다.
  • 블로그 게시물에 테이블 추가가격 비교, 기능 매트릭스 및 튜토리얼 참고 테이블 — Markdown은 추가하기 위해 가장 마찰이 적은 방식입니다.
  • CSV를 Markdown 테이블로 변환스프레드시트에서 CSV를 붙여넣고 문서 또는 노트에 붙여넣을 준비가 된 Markdown 테이블을 가져옵니다.

사용 방법

이 도구는 직접 작성한 JavaScript로 만든 완전한 클라이언트 측 Markdown 표 편집기입니다. 서드파티 표 라이브러리를 사용하지 않습니다. 실시간 열 너비 패딩과 열별 정렬 표시가 포함된 GitHub Flavored Markdown 파이프 표 구문을 브라우저에서 직접 생성하며, 같은 데이터를 HTML, CSV, JIRA 위키 마크업, reStructuredText 격자 표로도 내보낼 수 있습니다.

  1. 1
    시각적 격자에서 셀 편집
    모든 머리글과 셀은 편집 가능한 입력란입니다. 입력하면 React 상태 업데이트가 생성기를 즉시 다시 실행하는 useMemo 호출을 일으키므로, 디바운스 지연 없이 키를 누를 때마다 출력 패널이 새로 고쳐집니다.
  2. 2
    생성기가 GFM 구문을 패딩하고 이스케이프
    직접 작성한 generateMarkdown 함수는 각 열의 최대 내용 너비를 측정하고, 정렬을 위해 각 셀에 공백을 채우며, :--- / ---: / :---: 표시로 구분 행을 만들고, 문자 그대로의 파이프를 \|로, 줄바꿈을 br 요소로 이스케이프해 어떤 Markdown 렌더러에서도 표가 유효하게 합니다.
  3. 3
    CSV, TSV 또는 기존 Markdown 표 가져오기
    가져오기 상자에 붙여 넣으면 직접 작성한 RFC 4180 CSV/TSV 파서(lib/csv.ts) 또는 이스케이프되지 않은 파이프로 행을 나누고 구분 행에서 정렬을 읽는 자체 Markdown 표 파서가 실행되어, 기존 표를 편집기로 다시 불러올 수 있습니다.
  4. 4
    필요한 형식으로 복사
    출력 형식 탭을 바꾸면 해당 생성기(style 속성이 있는 HTML, RFC 4180 CSV, || 머리글이 있는 JIRA 위키 마크업, +---+ 테두리가 있는 reStructuredText 격자 표)가 다시 실행되고, 복사 버튼은 표준 navigator.clipboard API로 결과를 클립보드에 씁니다.

관련 도구

자주 묻는 질문