JavaScript, finally visible.

Imagine code, but visual. Objects become balls, primitives become pills, functions become frames you can watch run.

Works as a browser extension on any existing web page

Start free
▸ code rendered ◂
final.js LIVE
010203040506
// Meet Messi
let messi = {
  name: "Leo Messi",
  goals: 821,
  worldCups: 1
}
080910
// His country
let country = "Argentina"
 
1213141516
// The squad
let squad = [
  messi, dimaria, alvarez,
  martinez, paredes
]
1819202122
// Save each goal
squad.forEach(p =>
  db.insert("goals", p)
)
// → 9 rows
Translate to Vinci
I
let messi = { … }ball
II
let country = "…"pill
III
let squad = [ … ]array
IV
db.insert(…)database
Try it live

See Vinci in action
with code translated in realtime.

For the first time ever, we've made JavaScript visual through a language called Vinci — it converts JavaScript to visual code you can see executing. Edit the code on the left to see how Vinci appears on the right and play around with it.

23 examples, from "Meet Messi" to a full stack tour. Open the full tour →

No instrumentation. No SDK. No "click record." Vinci attaches to the browser's V8 + Network layer the moment a tab opens. Every fetch becomes a tool candidate.

① the website you opened
app.your-saas.com
My Tasks
Ship Vinci page
Email Armand
→ POST /api/tasks { title }
→ GET /api/tasks
→ PATCH /api/tasks/:id { done }
② vinci catalog
Tools discovered
createTask
{ title: string }
listTasks
{} → Task[]
markDone
{ id: string }
↳ exported as tools.json
③ lancy agent
A
Amy
Add "Send draft to Sarah" to my tasks.
Done — task created.
↪ createTask({title: "Send draft to Sarah"})
Full V8 + network trace recorded. Click to replay.

Same engine on any tab — your own webapp, a third-party SaaS, an internal admin panel. If JavaScript runs, Vinci can draw it.

Install & go

The browser, drawn for you.

Vinci attaches to the browser's V8 + Network layer the moment a tab opens. Objects become balls. Functions become frames. Mutations animate. Install the extension, open any website, and watch the runtime draw itself in real time. Zero code, zero setup.

1
Install

Drop the Vinci extension into Chrome, Firefox or Safari. Pin it. That's it — no SDK, no setup, no code in your app.

2
Open a website

Use the site like you normally would. Vinci watches every fetch, every form, every state change — passively, no recording button.

3
Watch it run

Every fetch, every state change, every mutation drawn live as it happens. The runtime, finally legible.

Get the extension
Chrome Available shortly
SOON
Firefox Available shortly
SOON
Safari Available shortly
SOON

Want early access? Join the waitlist and we'll send you the install link.

what ran
let legend = {
  name: "Leo Messi",
  goals: 838,
};

function archive(player) {
  // ...
}

archive(legend);
vinci sees
running
function frame
archive(player)
scope
legend
name "Leo Messi"
goals 838
arrival player ← legend
v8.scope · live · 0 ms ago
01

Passive capture.

The moment a tab opens, Vinci attaches CDP and starts watching. Network requests, V8 frames, scope changes — all without a single line of instrumentation in the page.

02

Wraps any web app.

Your own product. A SaaS you bought. An internal tool from 2014. If it runs JavaScript in the browser, Vinci can draw what it's doing.

03

Replayable runtime.

Every frame, every fetch, every mutation captured. Scrub back, watch it again, see what really happened. The runtime, on tape.

JavaScript,
finally visible.

Free during beta. Install the extension, open any web app, and watch the runtime draw itself.

Try Vinci