Introducing tldraw offline
Hey, it's Steve from tldraw.
Today we're launching tldraw offline, a file-based desktop application that brings our popular infinite canvas experience to your computer. You can get it for free at offline.tldraw.com.
The application has no accounts and no server, meaning that you can diagram, whiteboard, and organize your thoughts on tldraw's canvas while offline or underwater. If you've ever wanted to just work with tldraw using files that live on your computer, then you'll love tldraw offline.
There's another reason you might love tldraw offline: it works with AI.
Hey Claude, do it in tldraw
Specifically, it works incredibly well with the AI agents that also live on your computer. If you use tools like Claude Code, Codex, or Pi, then you'll be able to ask your agent to access, edit, and add scripts to your tldraw offline files.
Scripting brings a whole new dimension to the tldraw experience. Using latent features of the tldraw SDK, agents are able to drive the canvas to create shapes, import assets, listen to changes, and much more. In addition to one-off scripts, agents can also write persistent scripts that change tldraw's behavior, respond to external data, or communicate with other software. These scripts load whenever the file loads, allowing each tldraw file to operate as a little app of its own.
What exactly can you do? You can do a lot of things. Ask your agent to create illustrations for your slide deck, ask Codex to build applications based on your wireframes, or create a working user interface for your smart home. If your agent can do it on your computer, then it can do it with tldraw offline.
Backstory and lore
In winter break of 2024, I started playing around with building a desktop application for tldraw. To begin with, it was a side project to see what emerging agents could do, and I was relying on them to explain the native side of the project. While I got pretty far, there were some technical barriers I kept rubbing up against that felt too big to hand off to agents.
For one, I kept making naive mistakes, like saving the whole document after every change instead of just the updates. While it worked, it was slow and inefficient.
The holidays passed, and the project was shelved.
A whole year went by.
During the winter break of 2025, I started tinkering with it again. Like everyone else in tech, I was at home marveling at the new coding agents and throwing them at side projects.
The diff-sync issue I'd previously run into was quickly unblocked. Instead of saving the whole document to disk on every change, the agents got it working the same way tldraw's multiplayer sync works: only the bit that changed gets sent over and merged into the document, rather than the whole thing being rewritten each time. That alone made the app dramatically faster. It was basically feature complete.
It had all the functionality of tldraw, but it could be used without internet. All your files could be saved locally and remain private.
But I wanted a way to bring agents to the canvas while keeping it local. I wanted to see what could be possible if agents weren't confined by the guardrails that need to be in place when giving them access to the canvas online.
tldraw is a React website
Given that tldraw is fundamentally a website built on React, AI can generate code to fill in the gaps of things that aren't explicitly built, like hover states. There's no built-in "onHover" system on tldraw, but if you want text to change to purple when you hover over it, AI can use what are essentially escape hatches in the website to bridge that gap.
Getting agents to work on a local canvas is tricky. If the AI integration is built into the app, the agent can't have access to your files. The agents need to know where your files live so they can communicate with them. Getting the agent itself was easy — Claude Code, Codex, etc., could all already work on my computer and access my file system. So, it was all about getting them to be able to interact with the canvas.
Some of our previous work, including on fairies, meant we already had a harness that allowed us to mediate between the canvas on one side and the AI on the other. All we had to do was connect that harness to our canvas and the agent.
We run code
At the end of the day, we run code. Under everything else, that's what tldraw does. When you click and select something on the canvas, you're really just calling editor.select under the hood. We could expose that directly — the AI could generate editor.selectAll or editor.createShapes as plain text, and we'd run it.
Online, we'd never let an AI model generate code and just run it. That's a script injector. So everything has to pass through a constrained, imperative system: the AI generates a simplified schema, and we translate that into code ourselves.
But offline, that risk mostly disappears. There's no server; it's your computer. So we opened up a port that could accept raw JavaScript and run it directly, in context, with access to the editor and the window.
With these guardrails loosened, we realized there was a lot more we could do with agents on the canvas than we initially thought. We created a canvas that kept an updated architecture diagram of a project and changed as the codebase changed, built an interactive search of all the files on someone's desktop, and started playing pong on our desktop files.
That opened up a new set of possibilities. What if we wanted a set of code to be saved to a file and run again when we opened that file back up?
Actually, we run two
The next challenge was figuring out how to get the long-lived code an agent generated — what we started calling "scripts," as opposed to "execs" — to persist and rerun when you reopened the file.
If you want to generate 100 shapes on the canvas, the AI can run a single exec. But if you want to draw a bin that deletes any shapes you drag into it, that instruction needs to run anytime you open your file. That meant the code would have to become a part of the file itself, and that changed how we thought about the very structure of a tldraw file.
Instead of our traditional .tldr file used for tldraw.com, we needed something that would bring together all the data about the canvas, all the assets tied to it, and any scripts you wanted it to run.
We shifted to a new file format, the .tldraw file, which combines all of those components in a single file. It meant anyone, human or agent, could create a JavaScript file that lives alongside the canvas and can change the file's behavior.
On the team, we've had a lot of fun trading files around as we explore what scripts can do. If you create something incredible, please do let us know on the Discord.
A very good offline whiteboard
tldraw offline is a powerful whiteboard that you can use wherever you like. Use it on a plane. Save your files. Draw, diagram, annotate, wireframe, and embed media. Execute some code. Write some scripts. Get an agent to write some scripts. Get an offline agent to write some scripts.
All your files stay local and private. It's tldraw, offline.
