LabHub

Blog

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

한국어English日本語

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.

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:

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:

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:

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:

How to choose between Excalidraw and tldraw:


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:

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:

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:

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:

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:

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.

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.

Miro vs FigJam — how to choose

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:

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:

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:

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

Japan

Overall trends:


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

Recommendations by scenario.

Meetings / Discussions / Number One

Docs / Wiki / Blog

Code / Infrastructure / Diagrams as Code

Enterprise / Workflow

Design / Wireframes

AI Assist

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

Comments

No comments yet.

Sign in to leave a comment