Turn a GitHub repo into a diagram you can click into.
Paste a GitHub repository, public or private. Each main folder becomes a box with its README inside, and a box opens into the folders within it. Then draw the rest: any box or arrow can hold its own whiteboard or a page of notes.
Free, private projects included. No card.
Try it: click a stacked box to go inside. A page icon means the box holds a page.
What a box can hold
A page of notes
Click a box and write beside it: headings, lists, pictures, code. The page opens in a side panel, so the drawing stays where it is.
Another whiteboard
Double-click to go inside. The box becomes a whiteboard of its own, with boxes of its own. A trail of tabs shows how deep you are and leads back out.
Something that already exists
Link the same page from five places. It is one page, not five copies: edit it once, and every place that links to it shows where else it is used.
Arrows and groups hold things too. Everyone you invite edits together, live, with cursors. People who only need to look are viewers, and viewers are free.
Bring your notes from Notion, Obsidian, or a folder of Markdown. And connect an AI agent (Claude Code, Codex, Cursor, or anything else that speaks MCP) to read and edit your whiteboards as you, with your permissions.
Anything with parts that have parts
- Plan a move
- Visa, apartment, budget. Each one opens into its own steps.
- Map a system
- Services on top. Inside each, how it works. On each arrow, the contract between them.
- Take class notes
- Topics as boxes, each one's notes inside. A big topic opens into a whiteboard of its own.
- Run a research project
- Questions as boxes, with the sources and findings for each inside.
For developers
From a repository to a diagram
Import a GitHub repository, public or private, and start from its structure: a box for each main folder (up to 60), each folder's README inside its box, and folders inside folders as whiteboards inside boxes. Arrows come from .subcanvas files, where the repository has them. Then make it yours: move things, delete what isn't part of the design, draw what's missing.
- 1Paste a repository. A public one works as it is. For a private one, connect GitHub in Settings first: Subcanvas reads it, read-only, and it becomes a private project.
- 2Get the boxes. One for each main folder, with its path under the name and its README inside.
- 3Say what connects. Add a .subcanvas file to a folder to name what it talks to. Each connection becomes an arrow, drawn where the two folders meet, and its description becomes the page behind the arrow.
- 4Put it in your README. A public diagram embeds as a picture that follows your edits within minutes and links to the live version. The import is a one-time copy: later commits don't change it.
# services/payments/.subcanvas
title: Payments
description: Charges cards and reconciles payouts.
connects:
- to: services/ledger
label: gRPC
description: Posts a journal entry
for every settled charge.Pricing
Free for one person, with up to 100 private whiteboards and pages. When your workspace gets a second editor or needs more private work, Pro is $5 per editor a month. Viewers are always free.
Free
$0
- Unlimited public projects
- 100 private whiteboards and pages (descriptions of boxes and arrows don't count)
- One editor: you
- Unlimited viewers
- 1 GB of pictures and videos
Pro
$5
per editor, per month
- Unlimited private whiteboards and pages
- As many editors as your team needs
- Viewers stay free
- 100 GB of pictures and videos
Run it yourself
Open source
- The whole product, AGPL-3.0
- No plan limits
- Your server, your data