Nudge design mode for herdr Get started

Click the component.
Your agent gets the note.

Get it running Source

Start the daemon

One command in a herdr pane. It prints a pairing code, says where the extension lives so Chrome can load it, and then sits there listening on 127.0.0.1:8791 for the rest of the session. Everything the browser sends goes through it.

your-cool-terminal
The daemon in a terminal: a pixel NUDGE banner, the version line, a box with the pairing code and the two steps to pair, then log lines saying it is listening on 127.0.0.1:8791 and that it sent five selections to a pane.

Point and describe

I turn it on, hover until the outline sits around the thing I mean, and click. While I hover, the children of the highlighted component get their own outlines, so I can tell a card from the grid it lives in before I commit. Then I write what is wrong and press Enter.

localhost:3000
A pricing card highlighted in the overlay with a chip naming it article.card, and its heading, price and paragraph each outlined in their own colour.

Nudge the styles

The sliders button opens a live editor on the selected element. Anything I change there is applied to the page immediately, and the agent gets an exact before and after with the value as written in the stylesheet. So var(--space-4) arrives as var(--space-4), not as 16px.

localhost:3000
The composer with the live style editor open: text colour, background, opacity, font, size, weight and line height fields for the selected card.

It goes to the right pane

The daemon works out which repo the dev server belongs to and which herdr pane is working inside it, writes a note with the crops, and prompts that agent. The tray names it, and the menu lists the others if it guessed wrong. When the agent is done, Reload and show outlines everything from that review, and Reply adds a follow-up to the same note.

localhost:3000
The tray with the agent menu open, listing the herdr panes that could take this review with their status.
02

Setup

Full readme

Node 23.6+·herdr on PATH·Chrome

Install it once

01

Global on purpose. Chrome loads the extension from wherever the package sits on disk, and a global install stays put. npx nudge-mode works for a one-off try, but its folder lives in npm's cache and can vanish on the next version.

Terminal 
npm install -g nudge-mode

Start the daemon

02

In a pane in the herdr session you want reviews sent to. It draws a card with the pairing code and the folder Chrome needs, then stays up for the session. The code is kept at ~/.nudge/token.

Terminal 
nudge

Load it

03

Open the address below, turn on Developer mode, choose Load unpacked, and pick the folder from the card. Need it again? nudge extension prints it in another pane; add | pbcopy to copy it.

Terminal 
chrome://extensions

Pair them

04

Open the extension popup and paste the pairing code. Without it the daemon answers 401, on purpose. Why pairing exists in the readme says why.

From a clone

05

Builds dist/daemon.js and extension/dist, then starts the daemon from the repo root.

Terminal 
npm install && npm run build
Terminal 
npx .
03

Day to day

AltShiftD
Turns Nudge on for the tab, same as Turn on in the popup. Chrome shows the shortcut it assigned there.
hover
Highlights the component under the pointer. Its children are outlined too, each in its own colour.
click
Selects it and opens the composer.
Enter
Sends the comment to the queue. ShiftEnter for a new line.
Send
Writes the note and prompts the agent named in the tray. Its menu lists the others.