Skip to content
Tech News
← Back to articles

I use Excalidraw to manage my diagrams for my blog

read original get Excalidraw Digital Whiteboard → more articles
Why This Matters

This article highlights how automating graphic updates in Excalidraw can significantly streamline the process of creating and maintaining diagrams for technical blogs. By integrating scripts and GitHub actions, developers can save time and reduce frustration, making visual documentation more efficient and adaptable to changes.

Key Takeaways

TL;DR I use an Excalidraw, wrap the elements of interest with a frame, name it with export_ prefix, my forked excalidraw extension automatically generates SVGs for light and dark mode.

I used Excalidraw a lot in the past.

When breaking down a technical problem for myself When explaining a concept or an architecture to my coworkers.

Just recently a new usecase evolved.

Expressing my thoughts in my Blog.

While writing my first article the dependency between graphics and the text lead to a lot frustration. Fine-tuning the graphic led to an easier text. Changes in the text made me realize that some information in the graphic is not needed to grasp what should land.

Every change in a graphic in Excalidraw meant 9 clicks in Excalidraw.

Selecting the frame pressing export choose the right name + darkmode/lightmode postfix export switch light/dark mode choose the right name + darkmode/lightmode postfix export again realize that one label crossed the frame boundary starting at 1 again.

It took me about 45 seconds.

Automate it :-) .

... continue reading