Loading...
Visualize your codebase. Understand your architecture
Not just a diagram. Your actual code organized by dependencies and folder structure.
Visualization
See where your architecture breaks
Map your entire codebase on an interactive canvas. See dependency flow, collapse modules, highlight violations.
Diffs
AI writes fast. Now you can keep up.
Understand what changed, where, and what it touches at the speed code gets written
Pull Requests
See every PR change in context
Open a pull request on the canvas, inspect the changed files, and follow what those changes connect to across the codebase.
Structure
Zoom in for code. Zoom out for architecture.
Syntactic zoom renders your code differently as you change scale.
- Zoomed in: full detail
- Zoomed out: structural summaries that show what matters at that level
Dataflow
See how your code actually connects
Function calls, references, definitions, and implementations rendered as edges across your codebase.
AI AgentsCOMING SOON
Two-way bridge between agents and your code map
An MCP server connects agents to the canvas. They read your dependency graph, annotate flows, and turn explanations into visual diagrams, right on the canvas.
How it works
A local server analyzes your code and streams it to an interactive canvas
Browser
Canvas
Local server
- Code analysis
- File watcher
- MCP server
Codebase
GitHub
orLocal repo
Codebase
GitHub
orLocal repo
Local server
- Code analysis
- File watcher
- MCP server
Browser
Canvas
Native app coming soon
Currently runs in the browser with a local server
Getting Started
1
Start the server
Run this command in your terminal. It will download and start the Code Canvas server on port :3001
Terminal
npx code-canvas-server2
Open the canvas
Open your browser and go to the canvas app. It will automatically connect to your local server.
Open v2.codecanvas.appLanguage support
Full dependency analysis and LSP integration
JavaScript
TypeScript
React
Python
PLANNED
PHP
PLANNED
Next.js
PLANNED
Vue
PLANNED
Svelte
PLANNED
and more coming later
Pricing plans
△
Free Plan
£0/month
Codebase visualization — files, folders, and dependencies on the canvas
Load and visualize public repos
Smart layout algorithm with customization options
See local file changes inline
Limited PR viewing
+ more to come
♛
Pro Plan
£8/month
Private repo access
Connect to local repos
LSP visualization
Split and unified diff views
View all PRs on the canvas
AST visualization
COMING SOON
MCP server
+ more to come
FAQs
See how everything connects
Open the canvas, load your repo, and see your entire architecture. Files, dependencies, and changes, laid out in front of you.