Skip to content
diagramkit

Comparison

diagramkit vs Mermaid

Mermaid turns code into diagrams, and it’s free. diagramkit turns a sentence into a diagram you’d publish. Here are the same three prompts, with the Mermaid written by Claude.

1

How a CDN serves a page

“How a CDN serves a web page: the browser requests the page from the nearest edge server. On a cache hit, the edge returns its stored copy in milliseconds. On a cache miss, the edge fetches the page from the origin server, stores a copy, and returns it.”

Mermaid
Mermaid's result for: How a CDN serves a page
Correct, grouped into request, hit and miss. The edge and origin are steps, not places.
diagramkit
diagramkit's diagram for: How a CDN serves a page
The browser, the edge and the origin drawn as parts, with the hit and miss paths between them.
2

How a pull request gets merged

“How a pull request gets merged: a developer opens a pull request, CI runs the tests, and a reviewer either approves it or requests changes. Requested changes send it back to the developer. Once tests pass and it is approved, it merges into main and deploys.”

Mermaid
Mermaid's result for: How a pull request gets merged
Correct, with long curves and a decision that repeats the review.
diagramkit
diagramkit's diagram for: How a pull request gets merged
One line: tests and review side by side, both required before merge.
3

How RAG answers a question

“How RAG answers a question: the user's question is turned into an embedding, the vector database returns the most similar document chunks, and those chunks are added to the prompt so the LLM writes an answer grounded in them, with citations.”

Mermaid
Mermaid's result for: How RAG answers a question
Correct and readable, as two rows of plain boxes.
diagramkit
diagramkit's diagram for: How RAG answers a question
The whole pipeline, from the question to a cited answer, with icons for each part.

Which one is for you?

Pick Mermaid for

  • Diagrams that live as text in your repo and docs
  • GitHub, GitLab and Notion render it for free
  • Engineers who want to edit the code by hand

Pick diagramkit for

  • Diagrams you’d put in a blog post, a course or a launch
  • Your brand, icons and layout without writing styles
  • Animated versions for posts and videos
  • Asking in plain words, from the app, Claude or ChatGPT
Start free

Side by side

Mermaiddiagramkit
You writeMermaid codeA sentence
LooksMermaid’s default themeFinished, with icons, in your brand
Animation—MP4 and GIF
EditingEdit the codeClick any label, or ask for a change
PriceFree and open sourceFree, Pro $29, Team $49 a seat

See what it draws for you.

Make a diagram