Excalidraw Open Sources Its Text-to-Diagram Feature

zhangthinkin
2 min readDec 6, 2023

--

Excalidraw is a virtual whiteboard app specialized for drawing hand-drawn like diagrams. It provides an infinite, canvas-based whiteboard with a hand-drawn style and supports various features. Previously I shared: 72 PNGs, Illustrated Machine Learning, where the illustrations were all drawn using Excalidraw. In June when I was translating the illustrated machine learning, for convenience, I deployed a copy myself, adding Chinese handwriting fonts and math formula support.

Excalidraw has recently open-sourced its text-to-diagram feature, allowing users to input text descriptions and automatically convert them into corresponding charts or graphics. GitHub open source link: https://github.com/excalidraw/excalidraw... Online demo: https://excalidraw.com It’s very easy to use. Click the last icon in the middle of the top menu bar

Select “Text to diagram” and you can use it. The principle is to use AI to convert the prompt instructions into Mermaid, and then from Mermaid to diagram.

Mermaid is a JavaScript-based chart drawing tool that creates and dynamically modifies charts by parsing Markdown-like text syntax. The main purpose of Mermaid is to keep documentation updates up to date with development progress.

Then click “insert” and you can see the result. It’s a bit unclear, so exporting the image to see:

It actually supports Chinese. For example, I asked it to use Chinese portrait flowchart to show how to make a resume, and the result is:

Any part of the chart that you are not satisfied with can be modified on the page.

--

--