Draw your feedback onto your frontend and send it straight to Claude.
🧪 Work in progress, I'm still testing this as I build. Feedback welcome!
You need the Playwright MCP connected:
claude mcp add playwright npx @playwright/mcp@latest
Then install the plugin:
claude plugin marketplace add tomreinert/claude-annotate
claude plugin install annotate@claude-annotate --scope user
Launch Claude Code with the channel turned on:
claude --dangerously-load-development-channels plugin:annotate@claude-annotate
- Type
/annotate
. Claude launches a Playwright browser with the annotation toolbar. - Draw your feedback and hit Send. Claude makes the changes. - Profit!
Keep drawing and sending as often as you like. Say "stop reviewing" when you are done.
See the full guide for the toolbar shortcuts and FAQ (including why the
--dangerously-load-development-channels
flag is safe and how to skip it).
This works quite well in my local setup with an app running on localhost:3000. Many moving parts though, so I'm curious how it works in different enviroments.
Looking forward to feedback and issues!