Mermaid 에디터

Mermaid 구문을 작성하여 라이브 플로우차트, 시퀀스 또는 클래스 다이어그램 미리보기를 표시합니다. SVG, PNG 또는 JPEG로 내보내세요.

테마
100%
다이어그램 엔진 로드 중...

Mermaid 플로우차트 에디터 정보

에디터에서 Mermaid 다이어그램 구문을 작성하고 렌더링된 플로우차트, 시퀀스 다이어그램, 클래스 다이어그램 또는 기타 차트 유형을 실시간으로 업데이트합니다. 템플릿을 로드하여 빠르게 시작한 다음 다이어그램을 SVG, PNG 또는 JPEG로 내보내거나 나중에 편집할 수 있도록 구문을 복사합니다.

이 도구란?

텍스트를 사용하여 다이어그램을 작성하는 라이브 Mermaid 다이어그램 에디터입니다. 플로우차트, 시퀀스 다이어그램, 클래스 다이어그램 등을 편집할 때 렌더링 결과를 실시간으로 확인한 다음 이를 SVG, PNG 또는 JPEG로 내보낼 수 있습니다.

사용 방법

  1. 템플릿(플로우차트, 시퀀스, 클래스 등)을 선택하여 샘플 Mermaid 구문을 로드하거나 자신의 구문을 작성하세요.
  2. 구문을 편집하면 다이어그램 미리보기가 자동으로 업데이트됩니다.
  3. '이미지 내보내기'를 클릭하여 다이어그램을 SVG, PNG 또는 JPEG로 다운로드하거나 '구문 복사'를 클릭하여 Mermaid 코드를 복사하세요.
  4. 구문에 오류가 있으면 마지막으로 유효한 다이어그램이 표시된 상태로 유지되어 수정할 수 있습니다.

주요 활용 사례

활용 팁

자주 묻는 질문

Mermaid 구문이 지원하는 다이어그램 유형은 무엇인가요?

플로우차트, 시퀀스 다이어그램, 클래스 다이어그램, 상태 다이어그램, 엔터티-관계 다이어그램 등 여러 다이어그램 유형을 포함하므로 각각의 예제 구문을 보려면 템플릿을 선택합니다.

편집 중에 구문 오류를 발생시키면 어떻게 되나요?

편집기는 마지막으로 렌더링한 유효한 다이어그램을 표시된 상태로 유지하므로 진행 중인 작업이 명확하게 유지됩니다. 구문 오류를 수정하면 다이어그램이 자동으로 업데이트됩니다.

내보내기 형식을 선택해야 합니다: SVG, PNG, JPEG?

SVG는 벡터 기반이므로 모든 줌 수준에서 선명하게 유지되며 문서에 이상적입니다. PNG와 JPEG는 채팅 앱이나 슬라이드에서 SVG 지원이 제한될 수 있는 빠른 공유에 더 적합한 래스터 형식입니다.

내 코드와 함께 버전 관리에 다이어그램을 저장할 수 있나요?

네. Mermaid 다이어그램이 일반 텍스트 구문으로 작성되므로 .mmd 소스를 git에 직접 커밋하고 다른 코드 파일처럼 다이어그램의 변경 사항을 추적합니다.

내 다이어그램 구문이 렌더링을 위해 서버로 전송되나요?

아니요. 다이어그램이 브라우저에서 완전히 클라이언트 측으로 렌더링됩니다——구문과 다이어그램 콘텐츠가 어디에도 업로드되지 않습니다.

Mermaid 구문을 작성하여 라이브 플로우차트, 시퀀스 또는 클래스 다이어그램 미리보기를 표시합니다. SVG, PNG 또는 JPEG로 내보내세요. 무료, 가입 불필요.