I Built My Own Diagramming Tool
Source: Dev.to
Introduction
Terry Davis had a point. Not the most comfortable quote to open with in 2025, but the idea sticks: if you rely on tools without understanding them, you don’t really own your work.
I’ve been using Draw.io and Excalidraw for years—great tools. Yet every time I needed to explain an architecture, sketch a flow, or share a quick diagram during a call, I found myself fighting the tool instead of thinking.
So I built Markasso. The name is straightforward: Marker + Picasso. It’s a whiteboard engine for the browser, built from scratch—no dependencies, no framework, no runtime. Just the Canvas API and a keyboard‑first philosophy.
Why build it from scratch?
- Full control – I wanted to understand every line of code.
- Design constraint – “Zero dependencies” isn’t a performance trick; it forces clarity. When you can’t reach for a library, you have to think harder.
- Result – something lighter, faster, and fully yours.
Understanding what you’re building doesn’t mean doing everything alone. I used Claude as an AI assistant throughout the process—for architecture decisions, code review, and working through edge cases. Lorenzo Cataldi (github.com/lc-d) helped with the visual design side. The point isn’t to be a lone genius; it’s to stay on top of every decision, even the ones you delegate.
What Markasso does
- Keyboard‑first navigation and shortcuts (fully documented)
- Mermaid diagram support out of the box
- Custom export/import format so you can move your work between sessions
- Dark theme by default (20+ years of screens will do that to you)
- No profiling, no tracking — just Cloudflare for analytics and CI/CD
Who is it for?
- Developers who need a whiteboard for system design, architecture reviews, or explaining concepts on a call.
- Anyone who wants to draw on a dark page without logging in somewhere first.
It’s young. It’ll break. But it has potential.
Try it
Try it, break it, and tell me what’s wrong. Every report, complaint, or comment is welcome.