Mermaid Design

ASCII 렌더링

ASCII 모드는 Mermaid 다이어그램을 텍스트 아트로 변환합니다 — 코드 주석, README 파일, 풀 리퀘스트 설명, 터미널 출력 등 이미지를 넣을 수 없는 모든 곳에 적합합니다.

ASCII 모드로 전환

내비게이션 바의 모드 전환기에서 ASCII를 클릭하세요(또는 /ascii를 직접 여세요). 에디터의 동일한 Mermaid 코드가 SVG 대신 문자로 렌더링됩니다:

┌───────┐      ┌────────┐
│ Start │─────▶│ Ship it│
└───────┘      └────────┘

ASCII 렌더링은 mermaid-ascii의 TypeScript 포트인 beautiful-mermaid로 구동됩니다. 렌더러는 지연 로드되므로 ASCII 모드를 처음 열 때만 다운로드됩니다.

설정

ASCII 모드가 활성화되면 오른쪽 패널에 ASCII 설정이 표시됩니다:

  • 문자셋 — Unicode ─│┌는 박스 드로잉 문자를 사용해 부드러운 선과 모서리를 만듭니다. ASCII - | +는 출력을 일반 ASCII 문자로 제한해 호환성을 극대화합니다(오래된 터미널, 코드 리뷰 도구, 일반 텍스트 이메일).
  • 글꼴 크기 — 렌더링된 텍스트의 크기를 조절합니다. 큰 다이어그램을 좁은 주석 블록에 맞출 때 유용합니다.

지원되는 다이어그램 유형

플로차트와 시퀀스 다이어그램이 가장 잘 렌더링됩니다. 일부 Mermaid 다이어그램 유형은 아직 ASCII 렌더러에서 지원되지 않습니다 — 이런 경우 미리보기에 깨진 렌더링 대신 현지화된 대체 메시지가 표시됩니다.

매우 긴 링크(---->)는 렌더링 전에 자동으로 정규화되므로, 늘어난 엣지가 있는 다이어그램도 합리적인 출력을 생성합니다.

내보내기

ASCII 모드에서는 내보내기 대화 상자가 **TXT (일반 텍스트)**를 제공합니다 — 어디에나 붙여 넣을 수 있는 렌더링된 텍스트 다이어그램입니다. 내보내기 및 공유를 참조하세요.

ASCII 템플릿 둘러보기

/ascii/templates를 열어 템플릿 갤러리를 ASCII 아트로 둘러보세요. 지원되지 않는 템플릿은 자동으로 필터링되고, 유형 필터 칩이 시작점을 찾는 데 도움이 됩니다. 템플릿을 참조하세요.