A Chrome extension for AI builders

Stop describing UI changes.
Point at them.

Click any element on any site, edit it live, and Patchpin hands your coding agent a precise prompt with selectors, before and after, and screenshots. Works with Claude Code, Cursor, Codex and the rest.

Download for Chrome

Free preview: two saved changes per page. No account required.

Install from ZIP with Chrome’s Developer mode. Installation guide

Patchpin in select mode, outlining the page headline

Editing the headline text live, with its purple highlighted span preserved

Changing the call-to-action button's background and border radius

Three AI rewrite suggestions from a locally connected Claude Code

The finished change set with five changes, ready to copy as a prompt

Hands off to the agent you already use

The problem

Your agent can write the code. It just can’t see your screen.

Without Patchpin

make the hero headline shorter and the button purple, the main one, not the demo one. and more rounded? also the cards under it should stack on mobile I think

I’ve updated Button.tsx so all buttons are purple…

Three rounds later, you’re pasting screenshots into chat.

With Patchpin

## Change 2: style
Selector: #cta
XPath: /html[1]/body[1]/main[1]/div[1]/button[1]
CSS property: background-color
Current value: "rgb(22, 24, 29)"
Change to: "#6d4cff"

One paste. Exact element, exact values, right first time.

How it works

Point. Edit. Prompt. Ship.

Point at anything

Press Alt Shift P on any page: localhost, staging or production. Hover, click, done. Parent selection grabs whole sections.

Edit it for real

Rewrite copy in place, tweak colours, spacing and radius, or hide an element. You see the result on the real page, with nested links and styling kept intact.

Capture the context

Pixel-exact element crops, drag-to-capture areas and stitched full-page screenshots, bundled with selectors, XPath and nearby text.

Hand it off

Copy one prompt, open it straight in Cursor, or export a ZIP with prompt.md, changes.json and PNGs. Your agent does the source edit.

The output

A prompt your agent can’t misread.

This is the real prompt Patchpin produced for the demo above. Structured, specific, and safe: page text is marked as reference data, never as instructions.

Built for fast iteration

Everything you’d otherwise type out by hand.

Your agent watches, you point

Patchpin’s local MCP server lets Claude Code, Cursor or Codex pick up each change as you add it, fetch its screenshots, and mark it done. Pins turn green as the work lands.

A real design panel

Layout, size, spacing, type, colour, borders and shadows, edited together with a live preview. Your agent gets every before and after value, mapped to your design tokens.

Knows your components

On dev builds Patchpin reads React, Next.js, Vue, Svelte and Angular component names and source files, so your agent opens the right file first.

Variants, then pick the winner

Ask for two to four real variants of any section. Flip between them on the page and keep the one you like.

Pins and pictures

Every change is pinned to its element with an automatic screenshot. Paste or drop a mockup to show exactly what you mean.

Live text editing

Type straight onto the page, or edit styled spans and links as separate parts so formatting survives. Optional AI rewrites give you three alternatives in place.

Share it any way

Copy one prompt for a page or a whole site, or export a ZIP, an HTML report anyone can open, or a JSON change set a teammate can import.

Drafts that stick

Change sets are saved per page and follow single-page-app routes. Undo, replay previews, or come back tomorrow and export.

Works on any site

Localhost, staging, production, even sites you don’t own. No SDK, no framework plugin, no proxy.

Local-first by design

No account. No API key. No servers.

Patchpin runs entirely in your browser. It only touches a tab when you open it there, it makes no network calls by default, and your license activates offline. Your AI subscription stays yours.

✓ Temporary, per-tab access only
✓ Drafts stored in Chrome’s local storage
✓ Query strings and form values stripped
✓ Bring your own agent, any provider

Pricing

Pay once. Keep it.

No subscription. Patchpin has no servers to pay for, so you don’t either.

Preview

Free

Up to 2 changes per page
Live text and design previews, pins and variants
Agent inbox for Claude Code, Cursor and Codex
Element, area and viewport captures
Copy the prompt to any agent

Try two changes free

Launch giveaway · 10 lifetime licenses

Lifetime

$49 $29 one-time

Planned founding price. Paid checkout is not open yet.

Unlimited changes
Full-page stitched screenshots
ZIP bundles, HTML reports and JSON sharing
Free updates through version 1.x
A direct line to the founder

Get the free preview

FAQ

Questions, answered.

Does Patchpin change my code?

No. Edits are a temporary preview in the browser. Patchpin writes the prompt; your coding agent makes the real change in your repo, where you can review it.

Which coding agents does it work with?

Any agent that accepts text and images: Claude Code, Cursor, Codex, Copilot, Windsurf and the rest. Agents that speak MCP can also connect to Patchpin’s local agent inbox and pick up changes as you make them, and Cursor gets a one-click “Open prompt in Cursor” link.

Do I need an AI API key?

No. The optional AI rewrite feature talks to a small companion on your own machine, which uses the CLI you’re already signed in to.

Does it work on localhost and staging?

Yes. It works on any regular web page Chrome can open, including local dev servers, previews and production.

Why a one-time price and not a subscription?

Patchpin runs locally and uses your own agent, so there’s no server or AI bill behind it. A one-time license keeps it simple.

Your next patch starts here.

Download Patchpin, try two changes per page, and copy the prompt into your coding agent. I’m giving ten people on X a free lifetime license at launch.