midcode
The mid between code and no-code.

midcode opens your project on a live canvas. Click anything to see where it lives in the code, change it by hand, and the edit lands in your source files as a clean diff.
Your agent builds the site. You finish it by eye. Click an element and midcode points to the file and the line. Change the type, swap an image, fix a line of copy, and it lands in your file as a one line diff. No tokens spent on a nudge.
Your real site runs on an infinite canvas at desktop, tablet and phone widths, side by side. Type, colour, spacing and radius come from your own tokens, so the diff is the edit and nothing else.
Pin a comment to any element, then copy a brief with the file and line that Claude Code or Cursor can act on. Components open on a canvas of their own, variants as columns and states as rows.
Screenshots


What's New
Version 2.1.0
Information
- Developer
- Akila Studio
- Compatibility
- macOS
- Works with
- Next.js, React, SvelteKit, Vue, Astro, Laravel and Shopify themes
- Writes to
- Your source files
- Install
- Download, or brew install midcode
- Price
- $119 launch price, regularly $199