Connecting visual notes with Obsidian Excalidraw

Connected-note systems like Zettel-Kasten and Second Brain typically assume links point to text. The practical gap shows up when notes are visual—diagrams, sketches, and embedded drawings—because traditional linking and referencing don’t map cleanly onto image content. The core takeaway here is that Obsidian Excalidraw can bridge that divide by letting users link and embed visual notes while choosing whether links target the drawing (visual) side or the Markdown (text) side.

The workflow starts with “hybrid notes,” which combine an Excalidraw drawing with a Markdown section in the same Obsidian note. When a user creates a note template and draws on the Excalidraw side, the Markdown side can embed that drawing. Linking behaves similarly to text notes: a link can default to the visual component, but users can force a link to a specific Markdown heading so the embedded preview shows the text section instead. The same idea applies to embedding—using an exclamation mark can embed either the visual or the text portion depending on how the target is specified. This gives fine-grained control over what appears when someone hovers or previews a linked note.

A key design choice is how visual content is embedded for portability and future publishing. Three approaches exist for linking/embedding visual notes, but the recommended option is SVG. SVG offers better plugin independence than Markdown embeds that rely on Excalidraw staying installed: if Excalidraw disappears, the text side may remain, but the visual representation would not. With SVG, the drawing is preserved as an image format, and—crucially—links inside the visual can remain clickable when publishing later. Achieving that requires enabling auto-export of SVG and keeping the SVG filename synchronized with the Excalidraw drawing filename.

The transcript also flips the direction of embedding: text can be pulled into the drawing. Using Excalidraw’s command palette, users can insert either the entire Markdown note or a specific heading into the canvas, and the text stays synchronized—typing on one side updates the other. The message is that adding a visual component doesn’t replace text; it adds another addressable surface for linking.

The most distinctive capability is “visual block references.” Since images are contiguous, there’s no native concept of block references like there is for text. Excalidraw solves this by letting users reference subregions of a drawing using Excalidraw’s area and group copy modes. An “area” reference tracks a region tied to where elements sit in the canvas, updating when elements move. A “group” reference targets a specific set of elements, allowing users to package or unpackage parts of a diagram—useful for RPG session maps, character tokens, and counters. In a real example from a Dagger Heart session, grouped room layouts can be embedded as a unit, while other trackers (like action or fear-related elements) can be referenced so they update across the note.

Finally, visual linking only becomes useful if connections are visible. For that, the transcript points to ExcaliBrain, a community plugin built by the same developer as Excalidraw. ExcaliBrain renders a link graph around a selected note, showing both existing nodes and linked-but-missing notes, and it can reveal where visual and text links go via hover inspection. The result is a practical system for mixing textual, visual, and hybrid notes without losing the ability to navigate relationships between them.