A console-injected overlay that lets you click elements on a localhost page, drop pins, add notes, and copy a Claude-ready prompt with all the selectors. Useful when you want to point Claude at "fix these specific things on this page" without writing selectors by hand.
No install, no extension — just paste a script into your browser's DevTools console.
Start your project as usual (e.g. npm run dev → http://localhost:3001).
In VS Code, run "Open Integrated Browser" (Command Palette: Cmd+Shift+P → type it).
Enter your localhost URL (e.g. http://localhost:3001).
The integrated browser opens as a tab inside VS Code with full DevTools support.
Right-click the page → Inspect → switch to the Console tab.
Copy the contents of console.js and paste it into the console, then press Enter.
A small panel appears in the bottom-right of the page — you're tagging.
First time only: if Chrome blocks the paste with a "self-XSS" warning, type
allow pastingin the console (don't paste — type), press Enter, then paste the script.
| Action | Result |
|---|---|
| Hover an element | Highlights with a purple outline |
| Click an element | Drops a numbered pin + asks for an optional note |
| Pause button | Stops tagging so you can scroll/click normally |
| — (minimize) | Collapses the panel into a small floating search icon |
| Copy Prompt | Copies a Claude-ready Fix these: prompt with all selectors |
| Clear | Resets all pins and starts fresh |
Then paste into a Claude chat:
Fix these:
1. `nav.header.flex` — link color is wrong
2. `#hero h1` — too tight on mobile
3. `footer.site > p` — should be muted
"Uncaught SyntaxError: Unexpected identifier"
The script you pasted has curly/smart quotes (' ' " ") instead of straight quotes (' "). This happens when code is copied through Notes, Slack, iMessage, etc. Copy directly from console.js in this repo — it has straight quotes.
Nothing happens after pasting
Make sure you pasted the script into the Console tab, not the URL bar. The script starts with (function(){ — if it starts with javascript:, remove that prefix.
Want to re-run cleanly Refresh the page, then paste again. The script is idempotent on the same page (re-running toggles the panel).
console.js— paste-ready script (one-liner, straight quotes)index.html— same script wrapped as a draggable bookmarklet, in case you'd rather have it in your bookmarks bar