브라우저 내 렌더링

Mermaid를 SVG로 변환

Mermaid 코드를 붙여넣고 바로 미리본 뒤 깔끔한 SVG 파일로 내보낼 수 있습니다. README, 기술 문서, 제품 명세, 공유에 적합합니다.

Mermaid SVG 변환 체험

flowchart TD
  A[Mermaid 코드로 시작] --> B{이미지가 필요한가요?}
  B -->|PNG| C[문서용으로 내보내기]
  B -->|SVG| D[벡터 그래픽 내보내기]
  B -->|PDF| E[공유용으로 내보내기]
  C --> F[문서화 준비 완료]
  D --> F
  E --> F

Mermaid SVG 변환이란?

Mermaid SVG 변환은 Mermaid 텍스트 다이어그램을 다운로드 가능한 SVG 파일로 만드는 작업 흐름입니다. Mermaid2Img는 온라인 편집, 실시간 미리보기, 템플릿, 브라우저 내 내보내기를 지원합니다.

편집 중 실시간 미리보기

PNG/JPG/SVG/PDF를 한 곳에서 내보내기

템플릿, 테마, 줌, 이동, 로컬 기록 지원

Mermaid 코드는 브라우저에만 보관

Mermaid 온라인 미리보기 그 이상

Mermaid2Img는 온라인 에디터, 템플릿, 스타일 설정, 로컬 기록, 다중 형식 내보내기를 하나의 작업 공간에 제공합니다.

Mermaid 문법과 레이아웃 실시간 미리보기
PNG, JPG, SVG, PDF를 한 곳에서 내보내기
문서 작업에 필요한 22가지 다이어그램 템플릿
비공개 다이어그램에 적합한 브라우저 내 처리

Mermaid 내보내기 형식 선택

같은 다이어그램을 여러 형식으로 내보낼 수 있어 다운로드 전에 용도에 맞게 고를 수 있습니다.

PNG
README, 티켓, 문서, 채팅

대부분의 환경에서 잘 보이는 선명한 비트맵이 필요할 때 사용합니다.

JPG
작은 파일과 빠른 공유

투명 배경이 필요 없고 가벼운 미리보기 이미지가 필요할 때 적합합니다.

SVG
웹, 벡터 문서, 디자인 전달

확대해도 깨지지 않거나 나중에 스타일을 조정해야 할 때 사용합니다.

PDF
인쇄, 제안서, 발표 자료

다이어그램을 문서 형태로 전달해야 할 때 적합합니다.

사용 방법

1

Mermaid 코드를 붙여넣거나 템플릿으로 시작합니다.

2

실시간 미리보기를 확인하고 필요한 경우 문법을 수정합니다.

3

SVG로 내보내거나 전체 작업 공간에서 고급 설정을 조정합니다.

자주 묻는 질문

브라우저에서 Mermaid를 SVG로 변환할 수 있나요?

네. Mermaid2Img는 브라우저에서 다이어그램을 렌더링하고 내보내기 파일을 생성합니다.

Mermaid 코드가 서버로 업로드되나요?

아니요. 일반 렌더링과 내보내기는 브라우저에서 처리되므로 다이어그램 내용은 로컬에 남습니다.

어떤 Mermaid 다이어그램을 지원하나요?

플로우차트, 시퀀스 다이어그램, 클래스 다이어그램, 상태 다이어그램, ERD, 간트 차트, 마인드맵, 파이 차트, Git 그래프 등을 지원합니다.

온라인에서 편집하고 내보내기

아래 내장 에디터를 바로 사용하거나 고급 설정은 전체 작업 공간에서 열 수 있습니다.

Loading editor...