Page Feedback Annotator

Point it out.
Pass it on.

Show your coding agent exactly what to change. Right on the page.

Open this page on desktop to install.

See how it works

Just Markdown.

No MCP installation needed.

No API key.

Small note.
Useful context.

Write it your way.

Plain text or Markdown. “Make this button orange, like the dot in the logo.”

Reference another element.

Click Select, then the logo. Your agent gets both targets.

Ask to remove it.

Click Remove. The element stays on the page with red hatching, and your agent gets a removal request.

Reuse a quick action.

Apply a saved instruction, such as “Match this style”. Combine actions when needed.

Show the reference.

Drop, paste or attach an image. Add tags like design or bug.

Your usual feedback.
One click away.

Save your instructions in Options.
Pick them from Actions while you annotate.

  • Match this style
  • Check accessibility
  • Make it clearer
“Make this button orange, like the dot in the logo.”Actions 1

Let your agent
see what you see.

Add screenshot

Capture the selected element or area. Copy puts the Markdown on your clipboard and downloads a zip with every image it names.

Copy full HTML

Include the selected element and all its children, so your agent can see the structure.

Enable either per annotation, or set your defaults in Options.

A whole section.
Or just a few words.

Give an area some attention.

Draw around the artwork. “Give it more room.” Add a screenshot to show the whole selection.

Write the words you want.

Edit text in place. The export keeps the original and your replacement.

Independent design for thoughtful brands.Thoughtful design. Clear ideas. Room to grow.

Your habits.
Your defaults.

Interface border color

Keep the toolbar and editor visible on any website.

Clear on copy

Start fresh after copying. Turn it off to keep the current feedback.

Export format & name

A zip, a folder or a PDF. Name files with the date, domain or note count.

Screenshot & HTML defaults

Set your starting point. You can still change either option per annotation.

Saved actions

Add, edit and reuse your own instructions. Markdown supported.

Give your agent the brief.
Once.

Every website

Default system prompt

“Keep the existing design system.”
One default for every feedback batch.

studio-north.example

Per-domain prompt

“Use warm neutrals and generous spacing.”
A different brief for a different website.

More pages.
One review.

Move between pages on the same site. Your notes stay together, ready to copy.

  • Annotate as you browse.
  • Pause, resume and revisit your notes.
  • Copy the review or reopen saved history.
Sample review studio-north.example
  1. 01
    /

    Home

    Give the headline more room.

  2. 02
    /work

    Work

    Align the project thumbnails.

  3. 03
    /contact

    Contact

    Make the button easier to find.

One Markdown export3 pages · 3 notes
feedback.md Excerpt
# Page Feedback: 1 request on 1 page

## 1. button "Let’s work together↗" `#PFA-ID-FHEQ3`

**Request** (tags: `design`)

```text
Make this button orange, like the dot in the logo.
Match this style
```

**Captured context**

- Page: <https://studio-north.example/>
- Element: `<button id="contact" class="contact">`
- Selector: `button#contact` (matches: 1)
- Images: IMG-1 `images/IMG-1-element-screenshot.jpg`

Use warm neutrals and generous spacing.
Excerpt of a real export. Try copying it.

Any coding agent.
One simple handoff.

Copy. Paste. Let your agent make the change.

  • Codex
  • Claude Code
  • Cursor
  • Copilot
  • Gemini CLI
  • Hermes
  • OpenClaw
  • NanoClaw
  • Lovable
  • Bolt
  • Vercel

Or any workflow that accepts Markdown.

No special integration. No account to connect.

Ask for behavior, too.

“For PDF download, ask for confirmation first.” Select the download button and describe the change.

Copy for your agent.
Export for everyone else.

pfa-2026-10-29-14h30-7QK2D-4a.pdf

Copy

Markdown on your clipboard, ready to paste. With images, a zip downloads too, and the Markdown tells your agent where to find them.

Export a zip or a folder

feedback.md and an images/ folder, for agents that read files.

Export a PDF

Every request with its images, laid out on A4 pages. Send it to a client or a teammate who does not use an agent.

Pick the format and the file name pattern in Options.

Small details.
Less back and forth.

An ID for every note

Each note gets an ID like #PFA-ID-7QK2D. Click it to copy, then point your agent to that exact request.

Computed styles

Open the styles of the selected element in the editor. The non-default ones go into the export.

Session list

See every note of the session, with its tags. Click one to find it on the page, or delete it.

History

Your 50 latest sessions stay in History. Copy one again or resume it.

Hide annotations

Hide the badges and outlines to check the page as it is.

Keyboard shortcut

⌘ ⇧ F opens Page Feedback. Ctrl ⇧ F on Windows and Linux.

On your page.
On your machine.

Your notes, images and settings stay in local browser storage. Nothing is sent to an agent until you share it.

Local storage · No account · No tracking

Less back and forth.
More getting it right.

Open this page on desktop to install.