Mermaid 다이어그램 편집기
왼쪽에 Mermaid 구문을 작성하고 오른쪽에서 플로차트, 시퀀스 또는 간트 다이어그램이 실시간으로 렌더링되는 것을 확인하세요.
코드로서의 다이어그램을 만드는 데 필요한 모든 것
즉시 실시간 미리 보기
입력하는 순간 다이어그램이 렌더링되는 것을 확인하세요 — 빌드 단계 없음, 버튼 누름 없음, 대기 없음.
모든 Mermaid 다이어그램 유형
플로차트, 시퀀스 다이어그램, 클래스 다이어그램, 상태 다이어그램, 간트 차트, 마인드맵 등 — 전체 Mermaid 11 구문.
테마 전환
코드 한 줄 변경 없이 문서, 슬라이드 또는 대시보드에 맞게 기본, 중립 및 어두운 테마 사이를 전환하세요.
SVG 및 PNG 내보내기
선명한 벡터 SVG 또는 고해상도 PNG를 다운로드하거나 SVG 마크업을 클립보드에 바로 복사하세요.
비공개, 업로드 없음
모든 렌더링이 브라우저에서 로컬로 이루어집니다 — 다이어그램이 기기를 벗어나지 않으며 크기 제한과 계정이 없습니다.
명확한 구문 오류
유효하지 않은 다이어그램이 즉시 감지되어 읽기 쉬운 오류로 표시되므로 구문을 빠르게 수정할 수 있습니다.
Mermaid 다이어그램 편집기 소개
Mermaid 다이어그램 편집기는 Mermaid 다이어그램을 작성하고 미리 보는 무료 브라우저 내 도구입니다. 왼쪽에 Mermaid 구문을 입력하고 오른쪽에서 렌더링된 다이어그램이 실시간으로 업데이트되는 것을 확인하세요. 기본, 중립 및 어두운 세 가지 내장 테마가 있습니다. 다이어그램이 올바르게 보이면 코드 또는 SVG를 복사하거나 벡터 SVG 또는 고해상도 PNG로 다운로드하세요. 모든 것이 오픈소스 Mermaid 라이브러리로 로컬에서 실행되므로 업로드, 크기 제한이 없으며 계정이 필요 없습니다.
Mermaid 다이어그램 만드는 방법
아이디어에서 공유 가능한 다이어그램까지 세 단계.
다이어그램을 텍스트로 작성
내장 샘플에서 시작하거나 Mermaid 구문을 직접 입력하세요 — 플로차트, 시퀀스 다이어그램, 클래스 다이어그램 등.
실시간 렌더링 확인
편집하는 동안 다이어그램이 자동으로 업데이트됩니다. 드롭다운으로 테마를 전환하여 원하는 모양을 찾으세요.
내보내기 또는 공유
Mermaid 코드 또는 SVG를 복사하거나 문서, 슬라이드 및 README를 위해 다이어그램을 SVG 또는 PNG 파일로 다운로드하세요.
알아두면 좋은 점
다이어그램은 엄격한 보안 모드의 Mermaid 11로 렌더링되며 레이블을 살균하여 HTML이나 스크립트가 실행되지 않습니다 — 대화형 클릭 핸들러는 미리 보기에서 비활성화됩니다. 내보낸 PNG는 선명한 인쇄를 위해 2배 해상도로 렌더링되며 모든 것이 로컬로 실행되므로 파일 크기 제한이 없습니다.