Mermaid Viewer 소개

Mermaid Viewer는 브라우저에서 바로 돌아가는 무료 Mermaid 다이어그램 편집기입니다. 왼쪽에 Mermaid 텍스트를 쓰거나 붙여넣으면, 입력하는 동안 오른쪽에 렌더링된 다이어그램이 나타납니다.

렌더링은 여러분의 브라우저 안에서 일어납니다. 다이어그램이 서버로 업로드되거나 저장되거나 처리되지 않습니다. Mermaid는 여러분의 컴퓨터에서 JavaScript로 실행되고, 끌어다 놓은 파일도 로컬에서 읽습니다. 클라우드 도구에 붙여넣고 싶지 않은 다이어그램에도 쓸 수 있는 이유가 이것입니다. 내부 아키텍처, 레이블에 고객사 이름이 들어간 시스템, NDA가 걸린 자료 같은 것들 말입니다.

숨기기보다 말해두고 싶은 단서가 하나 있습니다. 공유 링크를 켜면 다이어그램이 URL 자체에 인코딩되고, 다른 사람에게 보내는 URL은 네트워크를 타고 갑니다. 그 외의 모든 것은 여러분의 컴퓨터에 남습니다.

소프트웨어 아키텍처를 문서로 남겨야 했는데, 다이어그램이 별도의 그리기 도구가 아니라 저장소 안, 코드 바로 옆에 있기를 바랐습니다. 그러기에 Mermaid는 당연한 형식이었습니다. 없던 것은 그것을 들여다볼 괜찮은 방법이었습니다.

도구부터 찾아 나서지는 않았습니다. 문제를 들여다보고, 작다고 판단했고, 짧은 시간에 깔끔한 걸 만들 수 있겠다고 어림잡았습니다. 그래서 만들었습니다. 이 프로젝트의 첫 커밋은 2026년 1월입니다.

저 자신을 위해 만들었고, 그 이상은 없었습니다. 다이어그램을 열고, 렌더링된 모습을 보고, 관심 있는 부분을 확대하고, 누군가에게 링크를 보내고 싶었을 뿐입니다. 다른 사람들이 찾아온 건 나중 일이고, 그 덕에 제가 시간을 쓰는 대상은 달라졌지만 도구의 성격은 달라지지 않았습니다.

렌더링은 Mermaid가 맡습니다. 이 사이트는 그 주변의 모든 것입니다. 즉시 미리보기가 되는 라이브 편집기, 한 화면에 담기지 않는 다이어그램을 위한 확대와 이동, 세 가지 테마, SVG와 PNG 내보내기, URL에 인코딩되는 공유 링크, .mmd와 .mermaid 파일 끌어다 놓기, 그리고 18개 언어 인터페이스.

이용은 무료이며, 방해되지 않는 광고로 유지됩니다.

질문과 버그 신고는 dominik@malsch.solutions로. 운영자 정보는 운영자 정보에 있습니다.