All posts

Excalidraw as a first-class citizen

Most note-taking apps treat drawings as second-class — upload an image, link to an external tool, or use a stripped-down canvas. Glifo embeds Excalidraw directly, so diagrams live next to your text and follow the same workflow.

How it works

Excalidraw runs inside Glifo as a React component. Drawings are stored as .excalidraw files in your vault — the same JSON format Excalidraw uses natively. No conversion, no proprietary format.

Create a drawing from the sidebar, and it opens in a full canvas with the complete Excalidraw toolkit: shapes, arrows, text, freehand, and the shape library.

Embedding in notes

Reference a drawing in any note with the embed syntax:

In the editor, the drawing renders inline as a static preview. You can see the diagram in context without switching views. Here's Glifo's architecture as an embedded drawing:

React UICodeMirrorTauri IPCinvoke()Rust Backendserde + git2FilesystemGit (libgit2)GitHub APIGitHub Actionspages-build-deploymentGitHub Pagesuser.github.iopush triggersdeploybuild status

Publishing as SVG

When you publish a note that contains drawing embeds, Glifo exports each drawing as inline SVG. No image files, no external assets — the vector graphics are embedded directly in the HTML.

This means:

  • Crisp rendering at any resolution
  • No broken image links
  • Dark mode support (SVG inherits the page theme)
  • Zero additional HTTP requests

Theme integration

By default, drawings follow your app's color scheme — dark mode app means dark mode canvas. You can override this per-drawing or globally in settings:

[editor]
excalidraw_theme = "auto"  # "auto", "dark", or "light"

The auto setting reads from your current theme, so drawings flip automatically when you toggle dark mode.

Why not a custom canvas?

Building a drawing tool from scratch would take years. Excalidraw is already excellent — open source, actively maintained, and used by millions. The decision was simple: embed the best tool rather than build a worse one.

The integration adds about 1.5 MB to the app bundle. For a full-featured diagramming tool with shape libraries, that's a bargain.

Drawings and writing belong together. When a diagram is one embed away, you actually make diagrams — instead of describing things that should be shown.