Skip to content
Published on

Diagramming Tools 2026 — Excalidraw / Mermaid / tldraw / D2 / Eraser / Lucidchart / Miro / FigJam Deep Dive

🇰🇷KO🇺🇸EN🇯🇵JA
Split View필사 모드
Authors

1. The 2026 Diagram Map — Infinite Canvas / Charts / DSLs / Whiteboards

In 2026, diagramming is not a single tool. The whiteboard you draw on during a meeting, the chart you embed in a doc, the architecture diagram you commit to Git, and the workshop canvas you fill with sticky notes — each scenario has a different top pick.

The broad map splits into four categories.

  • Infinite canvas / sketch — Excalidraw, tldraw, FigJam, Miro free-draw mode
  • Charts / DSLs / code-based — Mermaid, D2, PlantUML, Graphviz, ZenUML, Python diagrams, Eraser
  • Box and arrow diagram editors — Lucidchart, draw.io, Whimsical, OmniGraffle, Visio
  • Collaborative whiteboards — Miro, FigJam, Lucidspark, Mural

The three big shifts in 2026 are these. First, almost every tool now ships AI diagram generation — Mermaid AI generates clean diagrams from text, and tldraw's "Make Real" turns a hand-drawn wireframe into working HTML. Second, Markdown-based diagrams have become the de facto standard — GitHub, GitLab, Notion, Obsidian, and Slack all render Mermaid natively. Third, the "Diagrams as Code" category has matured to the point where D2, Eraser, and Mermaid provide clean, line-by-line DSLs that engineers actually enjoy using.

Five years ago the big question was "Lucidchart or Miro?". Now it has fragmented into "Excalidraw for meetings, Mermaid for docs, D2/Eraser for infra, FigJam for design workshops."

This post is a fast tour of all those tools as of May 2026. If you are a beginner it should help you pick a starting point. If you are senior engineering or design, it should help you decide what to add to your next project.

2. Excalidraw — The De Facto Standard for Hand-Drawn

Excalidraw is an open source diagram tool that Christopher Chedeau started in 2020. The hand-drawn marker style is its calling card, and that style has become its identity. With more than 90k GitHub stars, it is the overwhelming number one in the diagramming category.

Why is it so popular? First, the "not too polished" feel matches the energy of an in-progress discussion. A fully styled Lucidchart diagram tends to communicate "this design is decided", whereas Excalidraw's wavy lines say "we are still thinking together". Second, the code import path is strong — paste Mermaid syntax in and Excalidraw will redraw it in the hand-drawn style.

Key features as of 2026:

  • Runs directly in the browser at excalidraw.com, no sign-up required
  • Real-time collaboration with multiple cursors and auto-aligned arrows
  • Mermaid import — convert flowchart, sequence, and class diagrams to the hand-drawn style
  • Excalidraw+ — the paid SaaS, 5 USD per month per user, adds libraries, folders, and roles
  • Self-hosted — official Docker image; all data lives in browser IndexedDB by default
  • VS Code and Obsidian plugins so you draw inside your editor
  • LaTeX math, shared libraries, multilingual fonts including Korean and Japanese

Pricing is free. The MIT license also makes self-hosting free. The hosted Excalidraw+ at 5 USD per month adds team features, but the free version is enough for almost everything.

A typical scenario looks like this:

[Where Excalidraw wins]

1. Architecture debates in 1:1 or team meetings
   - One person shares screen and draws boxes and arrows live
   - "Wait, is that Kafka here?" gets resolved on the spot
   - Export PNG and attach to the meeting notes

2. The first diagram in an RFC or design doc
   - Drawn during the draft phase, not polished at the end
   - The hand-drawn look signals "still tentative"

3. Tech blog posts and conference slides
   - The not-too-clean style is approachable for readers
   - Exports to PDF, SVG, PNG, and clipboard

One limitation: it is weak for "final deliverables". External customer docs or polished conference slides are better served by Lucidchart or Figma.

3. Mermaid + Mermaid AI — The Markdown-Friendly Number One

Mermaid is a text-based diagramming library that Knut Sveidqvist created in 2014. You write a few lines of simple syntax inside a Markdown code fence and it renders as an SVG. As of 2026, GitHub, GitLab, Bitbucket, Notion, Obsidian, Slack, Microsoft Teams, Confluence, Joplin, and the VS Code preview all render Mermaid natively.

GitHub integrating Mermaid into its Markdown pipeline in early 2022 was the decisive moment. After that, "I need a diagram in the team wiki, let me write Mermaid" became the default workflow.

Key diagram types as of 2026:

  • flowchart — TD / LR direction, nodes and arrows
  • sequenceDiagram — actors and messages
  • classDiagram — UML class
  • erDiagram — ER for database modeling
  • stateDiagram-v2 — state machines
  • gantt — Gantt charts
  • pie — pie charts
  • journey — user journeys
  • mindmap — mind maps (added 2023)
  • timeline — timelines
  • C4Context — Simon Brown's C4 model
  • gitGraph — Git branch visualization
  • requirementDiagram — requirement tracking
  • architecture-beta — architecture diagrams (added 2024)

A simple sequence diagram looks like this (the source lives inside a Markdown code fence):

sequenceDiagram
    participant U as User
    participant API as API Gateway
    participant S as Service
    participant DB as Database

    U->>API: POST /orders
    API->>S: createOrder
    S->>DB: INSERT order
    DB-->>S: order_id
    S-->>API: 201 Created
    API-->>U: order_id

Mermaid AI is a feature that Mermaid Chart (the official commercial product) added in 2024. Given a natural-language prompt like "draw the sequence of a user placing an order", it generates the Mermaid code for you. The backend uses GPT-4 or Claude, but the model is fine-tuned on Mermaid syntax and is much more accurate than a general LLM.

Pricing: the OSS core is free. Mermaid Chart's AI and collaboration features start at 8 USD per month for individuals.

4. tldraw — Infinite Canvas + Make Real AI

tldraw is an open source infinite-canvas library and app from Steve Ruiz. It sits in the same category as Excalidraw, but its two differentiators are "easy to embed as a library in your own app" and "smoother infinite-canvas interaction".

The big moment for tldraw came in late 2023 with "Make Real". You sketch a rough wireframe (a button, an input, a card) and click Make Real, and GPT-4 reads the sketch and produces a working HTML/Tailwind component. It became the first viral demo of LLM-plus-canvas as a workflow.

In 2026 the use case splits in two:

  • Use it as a drawing app — open tldraw.com and start sketching, like Excalidraw
  • Use it as a library — embed an infinite canvas in your own React app via the tldraw SDK

The tldraw SDK is npm-installable. Self-hosting is allowed; the commercial license terms are generous on the free tier.

npm install tldraw

import { Tldraw } from 'tldraw'
import 'tldraw/tldraw.css'

export default function MyCanvas() {
  return <Tldraw />
}

Distinctive features:

  • Truly infinite canvas with smooth zoom and pan
  • Multiplayer collaboration with live cursors
  • Shapes API — define your own shape types (charts, code blocks, anything)
  • AI integrations — Make Real and "Computer Use" demos exploring LLM + canvas
  • Data model built on a custom CRDT, so offline edits merge cleanly

How to choose between Excalidraw and tldraw:

  • Hand-drawn vibe, meetings and doc attachments — Excalidraw
  • Embedding an infinite canvas in your own app, cleaner default shapes — tldraw
  • Both are free, both are open source, both are excellent

5. D2 (Terrastruct) — A Modern Graphviz DSL

D2 is a modern diagramming DSL from Terrastruct (Alexander Wang's company). It started from the conviction that "Graphviz is too old and Mermaid is too simple, so we need a real DSL in between". Open sourced in late 2022, it has crossed 16k GitHub stars by 2026 and is growing fast.

Three core appeals:

  • Syntax that is pleasant to read and write — a -> b: label style
  • Beautiful defaults — output looks clean without configuration
  • Containers, nesting, icons — strong for cloud infrastructure diagrams

A small example:

client -> api: HTTP
api -> postgres: SQL
api -> redis: Cache

api: {
  shape: cylinder
  style.fill: "#3b82f6"
}

postgres.shape: cylinder
redis.shape: cylinder

The CLI renders to SVG, PNG, or PDF. A VS Code extension and a web playground (D2 Playground) are also available.

brew install d2
d2 input.d2 output.svg

Highlight features:

  • Containers, grids, sequence diagrams, class diagrams
  • Embedded icons — AWS, GCP, Kubernetes, more than 1000 built-in icons
  • Themes — 16 built-in themes plus custom themes
  • Auto-layout — dagre default, ELK, plus Terrastruct's own TALA engine
  • Animations — render diffs between diagrams (great for PR reviews)

Pricing: the D2 CLI and library are free OSS. Terrastruct's hosted collaboration product (D2 Studio) starts at 19 USD per month for individuals.

D2's strength is the balance — "lays out more beautifully than Mermaid, dramatically easier than Graphviz". If you want to manage infrastructure or system architecture diagrams as code in 2026, it is the strongest candidate.

6. Eraser.io — Code-Based Architecture

Eraser.io is a collaborative diagramming SaaS launched in 2022. Its core differentiator is the "Diagrams as Code" mode — you type a DSL on the left and a visual diagram appears on the right.

In late 2024 the "Eraser DiagramGPT" feature went viral. Give it natural language ("draw a 3-tier web app on AWS", "draw this Terraform module") and it generates both DSL code and the rendered diagram. A GitHub integration also analyzes a codebase and auto-generates component diagrams.

Highlight features:

  • A purpose-built DSL — shorter and cleaner than Mermaid
  • Cloud icons — AWS, GCP, Azure, and Kubernetes included
  • Eraser AI — natural language to diagram via DiagramGPT
  • GitHub integration — auto-attaches diagrams to PRs
  • Multiplayer collaboration in real time
  • API — headless diagram generation server-side

Pricing: free for individuals (limited), 9 USD per user per month for teams.

[Eraser DSL example — sequence diagram]

User > Browser: opens app
Browser > API: HTTP GET /home
API > Database: SELECT user
Database > API: user data
API > Browser: HTML

Eraser's appeal is the trio of "clean DSL + SaaS collaboration + AI assist". Where D2 is OSS-first and CLI-first, Eraser is the "collaboration SaaS" play.

7. Lucidchart — The Enterprise Standard

Lucidchart, launched in 2010, is the standard enterprise diagramming tool. It started as a web replacement for Visio and now claims a much larger market than Microsoft Visio. Per their own numbers, 70 million users and 99% of the Fortune 500.

Why it dominates the enterprise:

  • Rich shape libraries — AWS, Azure, GCP, Cisco, ITIL, and other industry sets
  • Auto-diagram — generate ER diagrams and class diagrams from CSV, SQL, or code
  • Data linking — map Google Sheets or Excel data onto shapes with conditional formatting
  • SSO / SCIM / audit logging — satisfies enterprise IT requirements
  • Supports UML, BPMN, and Lucidchart's own conventions
  • AI Chart Generation — diagrams from natural language, text, or data

Pricing: free with limits, 7.95 USD per month for individuals, 9 USD per user per month for teams, custom for enterprise.

Scenarios where Lucidchart fits:

  • BPMN and workflow docs in regulated industries (insurance, finance, healthcare)
  • System flows you share with non-engineers (sales, marketing)
  • Companies that have already standardized on Lucidchart

Lucidspark, its sibling product, plays in the whiteboard category against Miro and FigJam. The Lucidchart + Lucidspark bundle is commonly sold in the enterprise.

8. Miro / FigJam — The Two Whiteboard Giants

By 2026, the collaborative whiteboard market has essentially consolidated into two giants — Miro and FigJam.

Miro

Miro launched in 2011 under the name RealtimeBoard and is the overwhelming leader of the whiteboard category. Per their own numbers, 45 million users and 99% of the Fortune 100.

  • Infinite canvas with smooth zoom for any workshop format
  • More than a thousand templates for affinity mapping, Lean Canvas, OKR, and more
  • Integrations with Jira, Asana, Notion, Slack, Zoom, and almost every SaaS
  • Miro AI — diagram generation, sticky note summarization, mind map expansion
  • Custom apps via the Miro Marketplace

Pricing: free (3 boards), 8 USD per user per month and up.

FigJam (Figma)

FigJam is the whiteboard tool Figma launched in 2021. The key differentiator is that it lives in the same workspace as your Figma design files.

  • Import design files — drag Figma components directly onto the FigJam board
  • Stickers, stamps, voice chat, timer
  • FigJam AI — diagram generation and meeting note summaries
  • Pricing — free (3 files), 5 USD per editor per month

Miro vs FigJam — how to choose

  • Lots of non-designers (PMs, engineers, sales, marketing) — Miro feels more natural
  • Already standardized on Figma — FigJam (cheaper, single bill)
  • Heavy on workshops, OKRs, design sprint templates — Miro
  • Tight design-to-engineering loop (wireframes to designs) — FigJam

The deciding factor is "who is facilitating". When a designer leads a workshop, FigJam tends to win. When a PM or consultant leads, Miro is the default.

9. draw.io / diagrams.net — The Eternal Free Option

draw.io (renamed to diagrams.net but the same tool) has been freely available since 2012, operated by JGraph in the UK.

Highlight points:

  • Completely free — no ads, no feature limits
  • Data sovereignty — save locally, to Google Drive, OneDrive, or Dropbox
  • Self-hostable — official Docker image for on-prem use
  • Rich shape libraries — AWS, GCP, Azure, Kubernetes, Cisco, and more
  • VS Code extension — edit .drawio files inside the IDE
  • Confluence and Jira plugins — the number-one diagram tool in the Atlassian Marketplace

draw.io's appeal is the "eternally free" promise. Even if the company disappears, a self-hosted instance keeps working and your data is safe. It is always the backup choice when Lucidchart gets acquired or raises prices.

Typical scenarios:

  • Companies or schools where a free tool is mandatory
  • Teams that cannot put data into an external SaaS (security or compliance)
  • Editing diagrams directly inside Confluence (the draw.io for Confluence plugin)

Downsides: the UI feels somewhat dated and collaboration is not as smooth as Lucidchart or Miro. But the price tag of zero forgives a lot.

10. Whimsical — Flows + Wireframes

Whimsical launched in 2017 as a multipurpose diagramming SaaS. Its differentiator is bundling "flowcharts + wireframes + mind maps + sticky notes" into one tool.

Highlight features:

  • Flowcharts with clean defaults — "looks good out of the box"
  • Wireframes — lighter than Sketch or Figma when you want a quick UI sketch
  • Mind maps, sticky notes, integrated docs that feel a bit like Notion
  • Whimsical AI — natural language to flowchart
  • Pricing — free (4 files), 12 USD per user per month and up

Whimsical's appeal is "tasteful defaults". Where Lucidchart and draw.io display 100% of features, Whimsical takes the "fewer features, prettier, cleaner" approach. You see it often at design-led teams like Toss and Kakao.

Downside: the free tier caps at 4 files. Serious use requires a paid plan.

11. Python diagrams (Mingrammer) / PlantUML / Graphviz — Code-Based Classics

The tradition of drawing diagrams in code runs deep. Three tools that are still active in 2026.

Python diagrams (Mingrammer)

A library that Korean developer Mingrammer (Kim Min-ho) shipped in 2020. It composes the official icons of AWS, GCP, Azure, Kubernetes, OpenStack, and more in Python to draw cloud architecture diagrams.

pip install diagrams

from diagrams import Diagram
from diagrams.aws.compute import EC2
from diagrams.aws.database import RDS
from diagrams.aws.network import ELB

with Diagram("Web Service", show=False):
    ELB("lb") >> EC2("web") >> RDS("db")

Running this produces web_service.png. With 35k GitHub stars it is the de facto standard for cloud architecture visuals. You see it in infrastructure RFC docs all the time.

PlantUML

A classic UML DSL going back to 2009. Written in Java and uses Graphviz as a backend. It supports every standard UML diagram (class, sequence, activity, use case, component).

Still widely used in universities, CS education, and Japanese SI companies. The big foreign tech firms (Microsoft, Google) have largely moved to Mermaid and D2, but at Japanese SI companies like NTT Data and Fujitsu, PlantUML remains the standard.

ZenUML

Like PlantUML it focuses on sequence diagrams, but with a more natural-language feel.

A.send {
  B.process()
  C.notify()
}

The web editor at zenuml.com is clean, and Confluence and Jira integrations are available.

Graphviz

The oldest tool here, originating at AT&T Bell Labs in 1991. Define nodes and edges in the DOT language and it auto-layouts to SVG or PNG.

digraph G {
  rankdir=LR;
  A -> B;
  B -> C;
  C -> A;
}

Graphviz's own defaults look a bit old, but it is the engine behind PlantUML, parts of D2, and many other tools. Its position as the underlying engine is rock solid.

12. AI Diagram Generation — Mermaid AI / ChatGPT / Claude

LLM-driven diagram generation went mainstream in 2025. Three flavors to know.

Mermaid AI / Eraser DiagramGPT / D2 AI

The AI features each tool ships officially. The advantage is that they are "fine-tuned on the tool's own DSL" — Mermaid AI returns almost 100% valid Mermaid code.

A typical workflow:

[Prompt]
"Draw the sequence of a 3-tier web app architecture"

[What Mermaid AI generates]
sequenceDiagram
    User->>WebApp: Request
    WebApp->>API: REST call
    API->>Database: SQL query
    Database-->>API: rows
    API-->>WebApp: JSON
    WebApp-->>User: HTML

ChatGPT / Claude — Mermaid / PlantUML / D2 from a general LLM

Both ChatGPT 4 and Claude 4.5 generate clean Mermaid and PlantUML. "Draw the sequence in this codebase" with the code attached returns a working Mermaid block.

Pro: no tool lock-in — one LLM can produce Mermaid, PlantUML, or D2. Con: occasional DSL errors — especially for newer DSLs like D2 where training data is thinner, you sometimes need a second pass.

Claude Artifacts — live preview

Claude.ai's Artifacts render Mermaid diagrams in real time. Follow-ups like "split the database into two" update the diagram instantly. For ping-pong refinement with an LLM, it is the fastest tool around.

tldraw Make Real — wireframe to HTML

tldraw's wedge is "sketch to working code". Draw buttons and inputs on the canvas, click Make Real, and GPT-4 generates working HTML/CSS.

The 2026 best practice is "tool-native AI plus general LLM". Draft with Mermaid Chart AI, then ping-pong with Claude to polish. That combination is the most natural workflow today.

13. Korea and Japan — Kakao, Toss, Mercari, CyberAgent

Regional preferences shake out as follows.

Korea

  • Toss — design discussion in Figma + FigJam, quick sketches in Excalidraw, infrastructure RFCs in D2 / Mermaid. The Toss Tech blog posts a lot of infrastructure diagrams
  • Kakao — Confluence + draw.io is essentially the internal standard. Design collaboration is in Figma. The Kakao Design team maintains their own design system (Karlo and the KakaoTalk component set)
  • Naver — different teams pick different tools given the company's size. NPay, Cloud, and LINE each maintain their own design systems. Mermaid, Excalidraw, and Lucidchart all appear
  • Woowa Brothers (Baemin) — the Woowahan tech blog frequently posts Excalidraw hand-drawn diagrams, matching the company's freewheeling vibe
  • Daangn (Karrot) — Figma + FigJam-centric, with some infrastructure teams using D2

Japan

  • Mercari — Miro is the internal standard. Design workshops use FigJam. Infrastructure diagrams use Mermaid + draw.io. Frequently shown on the mercari engineering blog
  • CyberAgent — FigJam-centric. Subsidiaries like AbemaTV standardize design systems on Figma. Infrastructure uses Mermaid + PlantUML
  • LINE — one of the companies with a strong PlantUML tradition. New projects are migrating to Mermaid / D2
  • DeNA / GREE — Lucidchart plus Confluence + draw.io combinations appear
  • NTT Data / Fujitsu / NEC — PlantUML is firmly standard, reflecting decades of UML documentation practice in SI

Overall trends:

  • Design-led companies (Toss, Daangn, Mercari, CyberAgent) — Figma + FigJam dominate
  • Engineering-led (Naver, Kakao, Mercari backend) — Mermaid + D2 + draw.io dominate
  • Traditional SI / enterprise (NTT, Fujitsu, NEC) — PlantUML + Lucidchart dominate

14. Who Should Pick What — Meetings / Docs / Code-First / Design

Recommendations by scenario.

Meetings / Discussions / Number One

  • Excalidraw — free, instant start, hand-drawn vibe
  • tldraw — embeds in your own app, infinite canvas
  • Miro / FigJam — large workshops with many people

Docs / Wiki / Blog

  • Mermaid — works in GitHub, Notion, Obsidian, Slack via Markdown code fences
  • D2 — cleaner and prettier than Mermaid
  • Excalidraw — when you want the hand-drawn vibe

Code / Infrastructure / Diagrams as Code

  • D2 — modern, clean, cloud icons
  • Eraser.io — collaboration SaaS + AI
  • Python diagrams (Mingrammer) — cloud architecture PNGs
  • PlantUML — UML standard, Japanese SI environments
  • Graphviz — simplest node-and-edge

Enterprise / Workflow

  • Lucidchart — BPMN, cross-department, the standard
  • Miro — consulting workshops, OKR
  • draw.io with Confluence plugin — security or free

Design / Wireframes

  • Figma + FigJam — design and wireframe and design in one workspace
  • Whimsical — quick wireframes and flows
  • OmniGraffle / Sketch — Mac-native, solo designer work

AI Assist

  • Mermaid Chart AI — accurate Mermaid code
  • Eraser DiagramGPT — natural language to architecture
  • Claude Artifacts — ping-pong refinement
  • tldraw Make Real — wireframe to HTML

The 2026 answer is not "standardize on one". It is "best fit by job". Excalidraw for meetings, Mermaid for docs, D2 for infrastructure, FigJam for workshops, Claude for polish — that mix is the most natural setup.

15. References

Excalidraw

Mermaid

tldraw

D2 (Terrastruct)

Eraser.io

Lucidchart

Miro / FigJam

draw.io / diagrams.net

Whimsical

Code-based classics

Other / designer tools

Korea / Japan case studies

Discuss on Twitter • View on GitHub