Spotnote

Vite plugin for UI feedback to coding agents.

Productivity

Open Source

Developer Tools

GitHub

Visit WebsiteSee on Product HuntVercel ⧉Github ⧉

Hey Product Hunt 👋 I use coding agents every day, and UI tweaks were always the slow part. I'd type something like "make the padding on the product card bigger", and the agent would spend its first few steps searching the codebase for which card I meant. Sometimes it found the wrong one. So I built Spotnote, a Vite plugin that tells your agent exactly where the change goes: 1. Click any element in your running app 2. Type what should change and press Enter 3. Paste the prompt into Claude Code, Cursor, Codex, or any chat The prompt includes the exact file, line, and column, the component path, where the component is used, and the current computed styles. Your agent goes straight to the right code. What makes it different - 🎯 Exact source location, not just a CSS selector - 🧩 Works with any Vite framework: React, Vue, Svelte, Solid, Astro… - 🪶 Zero imports. Add one line to vite.config.ts and you're done - 🔒 Local only. No account, no cloud, and it never ships to production - 🔗 Team mode: turn it on for a staging build and add a webhook, and reviewers' notes land in your team chat with file, line, and a screenshot Install it with npm install -D spotnote. It's free and MIT-licensed. I'd love your feedback, especially on two things: which frameworks or setups you'd like me to test next, and what else you'd want in the prompt your agent gets. I'll be here all day answering questions 🙌