TheCanvasForYourCode Agents Terminals Browsers Files Projects & Teams.

Download for Mac

The Spatial IDE for
Agent-First Development.

Multi-agent

A space for CLI agents
to shine.

Claude Code, Codex, Gemini CLI — watch them work across every project, in real time.

Claude
Anthropic
Codex
OpenAI
Gemini
Google
Node types

Every tool on
one canvas.

Agents, terminals, browsers, databases — drag anything onto your workspace.

Agents
Terminals
Browsers
Databases
Files
HTTP
Figma
Plugins
Spatial

Every project. One surface.

An infinite canvas. Drag folders on, zoom out to see everything at a glance.

Canvas.tsx
1
2
3
4
Preview
Terminal
1
2
3
45%
Local first

Your machine. Your files.

Nothing to configure. Drop a folder and go.

▸~/project
├─▸src/
├─◇app.tsx
├─◇store.ts
├─◇package.json
└─▸.mesa/
Workspace

Zero tab switches.

Code, terminal, preview, docs — all visible. No hunting through windows.

index.tsx
api.ts
Terminal
Preview
Docs
One surface
Agent-first

Direct agents. Not files.

Stop navigating file trees. Describe what you want — agents find the files, write the code, run the tests.

Old way
src/
├─auth.ts
├─page.tsx
├─store.ts
├─utils.ts
Mesa way
Fix auth bug✓
Build dashboard UI
Write test suite
Deploy preview
Your keys

No middleman.

Bring your own API keys. No markup, no rate limits, no per-seat AI pricing. You pay providers directly.

Anthropic
connected
OpenAI
connected
Google
connected
Multi-repo

Your whole stack at once.

Every repo on one canvas. Agents working across your entire stack simultaneously.

api-server
+023f
web-app
+041f
mobile
+014f
infra
+08f
Version control

Git, visualized.

Branch, diff, review, merge — without leaving the canvas.

Add auth middleware#42Open
main←feat/auth
const token = await validate(email)
− if (!token) throw new Error()
+ if (!token.valid) return null
+ setSession(token.refresh)
return redirect('/dashboard')
MultiplayerPro

Pair on everything.

Same canvas, same agents — side by side.

You
Sarah
Alex
52%
Extensible

Build any node.

React component + manifest. Your custom tools live on the canvas alongside everything else.

plugin.config.ts
export default {
name: "deploy-preview"
icon: "rocket",
panel: () => <Preview />
}
🚀
deploy-preview
Live
Worktrees

Worktrees, simplified.

Spin up worktrees as nodes on the canvas. Each gets its own agent, terminal, and preview — running side by side with main.

Terminal· mesa-app
$ pnpm dev
▲ Next.js 16.1.6 (Turbopack)
- Local: http://localhost:3000
- Network: http://192.168.1.42:3000
✓ Starting...
✓ Ready in 468ms
GET / 200 in 142ms
GET /api/auth 200 in 38ms
GET /dashboard 200 in 89ms
$
Database· users
SELECT * FROMusersLIMIT 255 rows
idnameemailrolecreated
1Alex Chenalex@mesa.devadmin2024-12-01
2Sarah Kimsarah@mesa.deveditor2024-12-03
3Jay Pateljay@mesa.devviewer2024-12-05
4Li Wangli@mesa.deveditor2024-12-08
5Mia Jonesmia@mesa.devviewer2024-12-10
AuthForm.tsx
1import { useState } from 'react'
2import { validateToken } from '../lib/auth'
3 
4export function AuthForm() {
5 const [email, setEmail] = useState('')
6 const [loading, setLoading] = useState(false)
7 
8 async function handleSubmit(e: FormEvent) {
9 e.preventDefault()
10 setLoading(true)
11 const token = await validateToken(email)
12 if (token.valid) {
13 router.push('/dashboard')
14 }
15 setLoading(false)
16 }
17 
18 return (
19 <form onSubmit={handleSubmit}>
20 <input value={email} onChange={...} />
Codex· mesa-web
❯ migrate class components to hooks
⎿ Migrated 12 components to functional.
⎿ Write src/components/* (12 files)
⎿ Bash pnpm test
✓ 48 passed
⎿ Done. All tests passing.
Claude· mesa-app
streaming
❯ implement auth middleware with JWT refresh tokens
⎿ I'll create the JWT middleware with refresh token rotation.
⎿ Read src/routes/auth.ts
⎿ Write src/middleware/jwt.ts (+47 lines)
⎿ Edit src/routes/auth.ts (3 changes)
⎿ Bash pnpm test auth
✓ 12 passed
⎿ Done. Created JWT middleware with 15m access / 7d refresh tokens.
⎿
Terminal
$ next dev --turbopack
▲ Next.js 16.0.0
- Local: http://localhost:3000
- Network: http://192.168.1.42:3000
✓ Ready in 1.2s
$ mesa attach browser --url localhost:3000
→ preview attached to canvas
$ ▊
mesa-app· feat/auth
~/Documents/GitHub/mesa-app
feat/auth3M2A1
Mcomponents/AuthForm.tsx
Acomponents/TokenBadge.tsx
Mroutes/auth.ts
Amiddleware/jwt.ts
+1 more
Commit
Push 1
Install
Dev
Build
Test
Panels3
Claudeimplementing auth
Shellpnpm dev
Browser:3000
HTTP· api
GET/api/users20012ms
POST/api/auth/login20038ms
GET/api/projects20067ms
PUT/api/users/120024ms
DELETE/api/sessions/old2048ms
GET/api/missing4043ms
Response Body
{"data": [{ ... }, { ... }]}
Browser
localhost:3000/dashboard
live
mesa-app
Dashboard
Projects
Settings
Team
Dashboard
Active Projects
4
Running Agents
2
Team Members
6
Recent Activity
Claude completed auth middleware2m ago
Sarah pushed to feat/auth5m ago
Tests passing on main12m ago
Files· mesa-app
mesa-app/src/components
src
public
tests
{}package.json
{}tsconfig.json
·.env.local
components
routes
middleware
lib
TSApp.tsx
TSmain.ts
TSAuthForm.tsx
TSTokenBadge.tsx
TSLayout.tsx
TSNav.tsx
TSButton.tsx

Most of your day is context. Which branch is that on. Where's the preview. What did the agent change. You already know what to build. The friction is everything around it — the tabs, the switching, the waiting to see what happened.

Mesa makes the work visible. Your projects, your agents, your previews — all on one surface. You see what's running, what's changing, what's ready. Less time managing. More time shipping.

Local. No accounts. No config. Download, open, drag a folder.

Your whole stack.
One canvas.

Projects, agents, terminals, previews — all on one surface.
Download Mesa and drop a folder.

Download for Mac
.dmg·.zip

Free to use · Auto-updates · Extensible via plugins