midcode, a visual editor for sites built in code
A visual editor for sites built in code, for macOS. My own product, not client work. I designed and built the app and its site: point at the page, fix it in the source.
- Role: Design + build
- Year: 2026
- Sector: Developer tools
- Built in: Built in code
On this page
The problem
midcode is my own product. It is not client work. I built it because it was the studio's own bottleneck.
It is for sites built in code. A coding agent builds the site, and the finish is done by eye: the type, an image, a line of copy. midcode is the tool for that part.
What I built
A Mac app that opens a project on a live canvas. The real site runs at desktop, tablet and phone widths, side by side. Click an element and midcode shows the file and the line where it is written. Change it by hand and the edit lands in the source file as a clean diff.
It has no export and no format of its own. The project stays a normal repository.
Around the canvas:
- A chat for Claude Code, Codex, Gemini CLI or OpenCode, in the same window
- The content, the database and the languages the project already has, each in its own view
- Branches, and a publish step that commits and pushes
The site
I designed midcode.app and built it in Next.js.
The editor in the hero is not a screenshot. It is rebuilt in the page and it answers: pick a layer and the style panel fills in.
Every feature is drawn the same way, as a small piece of the interface. The marketplace holds two starters, twelve sections and six prompts, and a starter plays its own page when you hover it.
Now
midcode is live and still in development. The changelog starts on September 8, 2026 with a first canvas. Version 2.1.0 went out on October 7.
