cd /news/developer-tools/show-hn-karen-app-feedback-as-easy-a… · home topics developer-tools article
[ARTICLE · art-129960] src=github.com ↗ pub= topic=developer-tools verified=true sentiment=↑ positive

Show HN: Karen – app feedback as easy as complaining

Developer Bassim Eledath released Karen, a development-only React overlay that captures spoken or typed feedback on specific components and packages it with component names, source locations, and optional region screenshots for pasting into a local coding agent. Karen relies on React Grab for component and source-location lookup and adds voice and text notes, region capture, review, and feedback handoff; it has no npm release yet, and the Git repository is named karen while the package/import remains feedbasha. The tool requires Node.js 20.19+ and Chrome for browser voice, and browser speech may send audio to the browser's speech service, with an optional Whisper provider supporting local transcription after its model downloads.

read2 min views1 publishedSep 15, 2026
Show HN: Karen – app feedback as easy as complaining
Image: Michielbdejong (auto-discovered)

Point at something in your app. Say what should change. Karen packages your feedback with component names, source locations, and optional region screenshots—ready to paste into your coding agent.

A development-only overlay for React apps. You bring the opinions and Karen turns it into usable context for your coding agent.

🔊 Sound on. This demo includes spoken feedback.

karen-demo.mp4 #

  1. Point. Click a component or drag over a region.
  2. Speak. Say what's off. Edit the transcript, or type instead.
  3. Hand it over. Review, copy feedback, and paste it into your local coding agent.

“That button” now comes with context. Karen doesn't edit your code; your agent does.

Run the included demo locally (Node.js 20.19+; Chrome for browser voice):

git clone https://github.com/bassimeledath/karen.git
cd karen
npm install
npm install --prefix examples/basic
npm run dev --prefix examples/basic

Open the localhost URL, click Karen, and select something to give feedback on. Allow microphone access when prompted.

Bring her to your app: React + Vite setup, screenshots, and Electron voice →

  • For development, not production. React source metadata is available when the development tooling exposes it.
  • Your agent needs the files. Region screenshots are optional; the included demo saves them locally and copies their paths, not the image pixels. The coding agent needs access to that same filesystem.
  • Voice isn't always offline. Browser speech may send audio to the browser's speech service. An optional Whisper provider supports local transcription after its model downloads. Text works without a microphone.
  • No npm release yet. The Git repository iskaren ; the package/import is stillfeedbasha . Don't runnpm install feedbasha —that's an unrelated npm package.

React Grab powers Karen's component and source-location lookup. Karen adds voice and text notes, region capture, review, and the feedback handoff. Thanks to Aiden Bai and the React Grab contributors.

Found something that deserves a word? Open an issue.

MIT · Integration reference · Example app

── more in #developer-tools 4 stories · sorted by recency
── more on @karen 3 stories trending now
sponsored brought to you by zahid.host 4,200+ EU-deployed projects
reading about agents? ship yours in a single git push.

Run your AI side-project on zahid.host

EU-based hosting, git-push deploys, automatic HTTPS, no cold starts. Free tier with a custom domain — perfect for shipping the agent you just read about.

$git push zahid main
Live at https://your-agent.zahid.host
Get free account → Pricing
from €0/mo · no card required
LIVE [news/show-hn-karen-app-fe…] indexed:0 read:2min 2026-09-15 ·