다이어그램 그리기 무료 도구 5가지 비교 - 설치 없이 브라우저에서 바로 쓰는 순서도 제작 가이드
draw.io부터 Excalidraw, Mermaid까지 회원가입 없이 무료로 쓸 수 있는 다이어그램 도구를 비교했습니다. 순서도, 마인드맵, 아키텍처 설계에 맞는 도구 선택법을 정리합니다.
![]()
순서도 하나 그리려고 파워포인트를 켰다가 도형 정렬만 30분 넘게 붙잡고 있던 경험, 한 번쯤 있으실 겁니다. 업무 프로세스 정리, 서비스 구조 설계, 회의 자료 준비까지 다이어그램이 필요한 순간은 생각보다 자주 찾아옵니다. 다행히 지금은 다이어그램 그리기 무료 도구가 충분히 성숙해서, 유료 프로그램 없이도 브라우저만으로 전문가 수준의 결과물을 만들 수 있습니다.
설치형 대신 브라우저 도구를 쓰는 이유
과거에는 Visio 같은 설치형 프로그램이 표준이었습니다. 하지만 브라우저 기반 도구가 대세가 된 데에는 분명한 이유가 있습니다.
- 설치와 라이선스가 필요 없음: 접속하면 바로 작업을 시작할 수 있고, 회사 PC처럼 프로그램 설치가 제한된 환경에서도 쓸 수 있습니다.
- 실시간 협업: 링크 하나로 팀원과 같은 캔버스를 동시에 편집할 수 있습니다.
- 자동 저장과 클라우드 연동: Google Drive, OneDrive 등에 바로 저장되어 파일 유실 걱정이 줄어듭니다.
- 운영체제 무관: Windows, Mac, 리눅스 어디서든 동일하게 동작합니다.
특히 혼자 쓰는 게 아니라 팀과 공유해야 하는 다이어그램이라면 브라우저 도구의 협업 기능이 결정적인 차이를 만듭니다.
무료 다이어그램 도구 5가지 한눈에 비교
수많은 도구 중에서 실제로 무료 범위가 넓고 완성도가 검증된 5가지를 추렸습니다.
| 도구 | 강점 | 회원가입 | 무료 범위 |
|---|---|---|---|
| draw.io (diagrams.net) | 순서도, 네트워크, ERD 등 만능형 | 불필요 | 전 기능 무료 |
| Excalidraw | 손그림 느낌의 빠른 스케치 | 불필요 | 기본 기능 무료, 오픈소스 |
| Mermaid | 텍스트 코드로 다이어그램 생성 | 불필요 | 완전 무료, 오픈소스 |
| FigJam | 화이트보드형 브레인스토밍 | 필요 | 무료 플랜 파일 3개 |
| Google Drawings | 구글 문서와의 연동 | 구글 계정 | 무료 |
상황별 추천 - draw.io와 Excalidraw
정식 문서용 다이어그램은 draw.io
draw.io는 app.diagrams.net에 접속하면 회원가입 없이 바로 쓸 수 있습니다. 순서도, 조직도, 네트워크 구성도, ERD, UML까지 거의 모든 다이어그램 유형의 도형 라이브러리를 갖추고 있고, 저장 위치를 Google Drive, OneDrive, GitHub, 내 컴퓨터 중에서 고를 수 있습니다. 오프라인에서 쓰고 싶다면 데스크톱 앱도 무료로 제공됩니다. 기능 제한이나 워터마크가 전혀 없다는 점이 가장 큰 장점입니다.
빠른 아이디어 스케치는 Excalidraw
Excalidraw는 손으로 그린 듯한 스타일이 특징입니다. 딱딱한 공식 문서보다는 회의 중 아이디어를 빠르게 시각화하거나, 블로그에 넣을 친근한 느낌의 그림이 필요할 때 어울립니다. 링크 공유로 실시간 협업이 가능하고, PNG와 SVG로 내보낼 수 있습니다. 오픈소스라서 원하면 직접 서버에 설치해 운영할 수도 있습니다.
도구 선택의 기준은 기능 개수가 아니라 목적입니다. 보고서에 들어갈 정식 다이어그램이면 draw.io, 10분 안에 끝내야 하는 스케치면 Excalidraw. 이 기준 하나만 기억해도 도구 고르는 시간을 크게 줄일 수 있습니다.
텍스트로 그리는 Mermaid 활용법
Mermaid는 접근 방식이 완전히 다릅니다. 마우스로 도형을 배치하는 대신 텍스트 코드를 작성하면 다이어그램이 자동으로 그려집니다. 예를 들어 graph TD; A-->B; 한 줄이면 A에서 B로 향하는 화살표가 생성됩니다.
텍스트 기반이라 얻는 이점이 명확합니다.
- 버전 관리: 코드 형태라서 Git으로 변경 이력을 추적할 수 있습니다.
- GitHub 지원: GitHub 마크다운 파일 안에서 Mermaid 코드가 자동으로 렌더링됩니다.
- 수정 속도: 노드 이름 하나 바꾸려고 도형을 일일이 옮길 필요가 없습니다.
mermaid.live에서 별도 설치 없이 바로 작성하고 미리보기할 수 있으니, 개발 문서를 자주 쓰는 분이라면 익혀둘 가치가 충분합니다. 문법을 익히는 데 30분 정도면 기본 순서도는 그릴 수 있습니다.
실무 활용 팁과 함께 쓰기 좋은 도구
내보내기 형식은 SVG를 우선으로
다이어그램을 문서나 웹에 넣을 때 PNG로 내보내면 확대 시 화질이 깨집니다. draw.io, Excalidraw, Mermaid 모두 SVG 내보내기를 지원하니, 크기를 자유롭게 조절해야 하는 상황이라면 SVG를 선택하세요.
브라우저 무료 도구 조합하기
다이어그램 작업을 하다 보면 주변 작업도 같이 따라옵니다. 완성한 다이어그램을 개인 블로그나 사이트에 올려 정리하는 분이라면 사이트 아이콘까지 신경 쓰게 되는데, 이때도 설치 없이 파비콘 생성기 같은 브라우저 도구로 몇 분 만에 해결할 수 있습니다. 또 서버 로그나 API 응답을 순서도로 정리하는 개발 문서 작업에서는 유닉스 타임 값을 사람이 읽을 수 있는 날짜로 바꿔야 할 때가 많은데, 타임스탬프 변환기를 띄워두면 왔다 갔다 하는 수고가 줄어듭니다.
오늘 바로 시작하는 방법
도구 비교만 하다가 정작 그림은 못 그리는 경우가 많습니다. 지금 필요한 다이어그램이 있다면 두 가지만 하시면 됩니다.
첫째, app.diagrams.net에 접속해서 회원가입 없이 순서도 템플릿 하나를 열어보세요. 10분만 만져보면 기본 조작은 익혀집니다. 둘째, 개발 문서를 다루는 분이라면 mermaid.live에서 예제 코드를 수정하며 텍스트 방식이 본인에게 맞는지 확인해 보세요. 두 도구 모두 완전 무료이니 부담 없이 시작할 수 있습니다.