DevPin
Live demo: nothing is saved

Pin feedback on a build. Watch the fix-prompt write itself.

This is a pretend staging deploy. Click Add feedback, then pin anything (a button, the header, even cramped spacing), and DevPin turns your note into the exact task a developer (or their AI tool) can act on, generated live, on the right.

1 pin on this build
https://northwind-supply.vercel.app/checkoutpreview
Northwind Supply/ Checkout
jane@client.com
2200 Bryant St
San Francisco
WELCOME10

Order summary

Field Notes 3-pack$29.00
Ceramic mug$18.00
Canvas tote$24.00
Shipping$6.00
Total$83.39
What your team gets
pin #1: <button#place-order> Place order
A reviewer left feedback on a web app (project "Northwind Supply"). Address it.

## Where
- Page: https://northwind-supply.vercel.app/checkout
- Element: <button#place-order> Place order
- Position: clicked at (495, 582); element box 150x44 at (420, 560); viewport 1280x832

## Feedback
> The "Place order" button overlaps the order total on mobile, and the label is cut off below 380px.

Reported by you@example.com.

## What to do
1. Locate the element or component described above in the codebase.
2. Reproduce the issue the reviewer described.
3. Implement a fix consistent with the existing design system and code conventions.
4. Verify the fix at the same viewport, and check it does not regress nearby UI.
Paste into Cursor, Claude Code, or any chat, or export it straight to a GitHub / Linear / Jira issue. On a live build, each pin also captures a screenshot.

This is the always-free output. Add Claude polish, tracker export, and your whole team on a real project.

Start free