Point, don't describe.

What you get

• Exact spot. Your UI feedback points to the exact file, line and column in your source code, so your agent doesn't have to search for it.
• Any Vite framework. React, Vue, Svelte, Solid, Astro, and so on.
• Zero imports. Nothing to import in your app code.
• Production stays clean. Spotnote runs only in vite dev, and in staging builds you turn it on for.
• Everything is local. No account, no cloud.

Output

The prompt Spotnote copies for a note, ready to paste into your agent:

## Request
Make the padding bigger

## Target
- file: components/ProductCard.jsx
- line: 7, column: 5
- used at: pages/Products.jsx:68 (<ProductCard> in Products)
- element: <div class="product">
- text: "shoes Aero Runner $120"
- instance: 1 of 12 rendered from this line (by DOM order) — target the one matching the text above

## Source path (outer → inner)
App > Products > ProductCard

## Current computed styles
  padding: 16px
  margin: 0px
  color: rgb(26, 26, 26)
  background: rgba(0, 0, 0, 0)
  font-size: 16px
  font-weight: 400
  border-radius: 12px

Every field is explained in Prompt Format.

Works with

React, Solid, Vue, Svelte and Astro, on Vite 5 or later. See Framework support.

Next

• Try it: on a small shop, before you install it.
• Installation: about 1 minute.