Skip to content

About

Browser and phone client for herdr: chat and live terminal for every agent pane, remote PCs over SSH, web push alerts

Topics

Resources

Code of conduct

Contributing

Security policy

Stars

710 stars

Watchers

0 watching

Forks

Latest commit

 

History

732 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

herdr web ui

herdr web ui

English · 简体中文 · 日本語 · 한국어

website · install · try the demo · quick start · faq · docs

MIT license GitHub stars Latest release herdr 0.9.0+ Installable PWA


herdr-web-ui.mp4

One Claude Code session: in herdr's terminal, then the browser's Terminal and Chat, then the phone, where a new worktree starts beside it · recorded live, no cuts

Claude Code and Codex, from your phone.

A browser and phone client for herdr. Read and reply to the same agent sessions running on your computer — on desktop or phone, as chat, with the terminal when you need it.

Live recording. The browser shows Claude Code's reply in Chat; a click on Terminal shows the same pane as Claude Code's own terminal, with its edit adding the test "unknown refund is 404" to src/server.test.ts. On the phone, in the tests tab's terminal, ↑ on the key bar brings back bun test and the key bar's Enter runs it: 5 pass, 0 fail.
Switch to the live terminal
One click turns the chat into the pane's real terminal; on the phone, ↑ on the key bar brings back the test command and Enter beside it runs it again.
Live recording. The browser shows herdr's layout: four workspaces in the sidebar, each row ending in its agent's state (a green dot on checkout-api, whose Claude has finished, a turning arc on web-dashboard, whose Codex is working, nothing on infra and release), and checkout-api's tabs payments and dev. A click on the dev tab shows its first pane, tests, with bun test's 4 pass; the tab's pane menu lists the split's two panes, tests and git, and a click on git shows its git log while checkout-api's row names git. On the phone, ☰ opens the same four workspaces with the same states, and a tap on checkout-api opens Claude's chat: "What does this repo do? Answer in one line." and its answer.
Your herdr layout, in the browser
Every workspace, tab and split pane, with each agent's state: click a tab, pick a pane of a split, or switch workspaces from the phone.
Live recording. The phone shows another workspace's terminal while Claude works on checkout-api in the browser. When Claude asks which rate limit to use, an alert reading "checkout-api Needs input" drops in on the phone and a tap opens the question as a card; in the browser, checkout-api's row and its row under Agents show a red question mark, and the same card waits in its chat.
Know when an agent needs you
On another workspace, an alert drops in when Claude asks; one tap opens its question.
Live recording. On the phone, checkout-api's empty chat asks "What should Claude do in checkout-api?". The + button attaches a screenshot of a receipt whose total reads $NaN and inserts its path, then "Fix this, with a test." is typed and sent. The camera pulls back as the message with the screenshot appears on the phone and in the desktop's chat, then moves in on the desktop's chat. In the full video, Claude then runs its first command, which reads src/routes/receipt.ts and src/server.ts.
Send a screenshot from your phone
The + button uploads it into the pane's folder and adds its path; Claude reads the image.
Live recording. In the browser's terminal, Claude Code has written bench/p95.svg; a click on the path in its answer opens the chart in the file viewer, and a tap on the same path in the phone's chat opens it full screen.
Open what the agent made
Click a path in the terminal, or tap it in the chat: the file opens right there.
Live recording. On the phone, checkout-api's ⋯ menu → New worktree opens a form with the branch worktree/clear-field-23e0 already filled in; Claude Code is picked and Create worktree is tapped. The camera moves to the browser, where checkout-api's folder is open with the new checkout nested under it, marked as Claude; its row then reads Claude Code over worktree-clear-field-23e0, and the Agents list shows it as a fourth agent.
Branch off a second agent
From the phone, ⋯ → New worktree: the branch is filled in, pick an agent, and it starts beside the first.

Each clip is a live recording of the desktop and a phone at once, in real time with no cuts. Click one for the full video.

  • Chat and terminal, one pane — native Claude Code, Codex, omp, omo, gjc and pi transcripts, plus OpenCode 2 and Devin CLI sessions herdr identifies, with the live terminal a click away. Write the next message while the agent works: it goes in with the next turn, or at once with Send now. Supported agents →
  • Approve with a tap — approvals, questions and plan menus become cards, checked to be current before your answer is sent.
  • Know when you're needed — live status for every pane, an alert that drops in while the app is open, and push alerts when an agent needs input or finishes, even with the app closed.
  • Install it on your phone — a PWA with a key bar above the keyboard (Esc, Tab, Ctrl, Alt, Shift, Enter, arrows) that you can rearrange and extend with your own combinations in Settings, and a QR code to your Tailscale address. Phone setup →
  • Speak instead of typing — dictate into the chat or the terminal line, Korean and English mixed. Review the words before sending them to the agent; transcription uses your own OpenAI key or the browser's speech recognition.
  • Keep your workflow — herdr owns the agents; this app connects to them. Update from Settings without stopping them, with patch notes for what each update brings. New tabs and worktrees come from a row's ⋯ menu. All features →

install

curl -fsSL https://herdrweb.dev/install.sh | sh

Linux (x64, arm64) or macOS. Installs missing herdr 0.9.0+, Bun 1.4+ and Node 18+ prerequisites for your user, then installs the app as a herdr plugin. If an existing herdr installation is older than 0.9.0, update and restart herdr yourself before rerunning the installer. With the default listen address and Tailscale running, successful HTTPS setup provides a tailnet address and QR code. Your own devices get in without a code as it is: tailscale serve states your login. If your own phone is asked to pair anyway, HERDR_WEB_TAILSCALE_SERVE_ONLY=1 lets it in without a code on a tailnet one login owns, but only when nothing else, such as a public proxy or tunnel, reaches this port (Access and safety).

Windows x64, in PowerShell:

irm https://herdrweb.dev/install.ps1 | iex

Requires Git for Windows. Installs missing herdr and Bun for your user, then installs the same plugin. No Node or WSL is needed. Open Phone setup in herdr for phone access. Windows terminals use the screen mirror, with typing and a fixed grid, until herdr supports terminal attach there.

Installer output: Bun, Node and the herdr plugin install, then tailscale serve publishes the app and a QR code for the phone appears.

Already have the prerequisites? Install just the plugin:

herdr plugin install devswha/herdr-web-ui

With herdr running, open localhost:7317. Pick a pane or start an agent with New workspace. To use your phone, scan the installer's QR code and add the app to your home screen. Quick start →

The server listens on 127.0.0.1 by default. For access from another device, see phone setup and access and safety.

faq

Can I use Claude Code or Codex from my phone?

Yes. Run the agent in a herdr pane on your computer, and this app shows the same pane in your phone's browser: the agent's own transcript as a chat, its approvals and questions as cards you tap, and the live terminal a tap away. It installs to the home screen as a PWA and sends a push alert when an agent needs you. Phone setup →

Which agents does the chat view support?

Claude Code, Codex, omp, omo, gjc and pi are read from their own session files. For OpenCode 2, the chat reads the session herdr reports from OpenCode's database; the home screen and OpenCode 1.x use the live terminal instead. Devin CLI is a chat when herdr or the running process names its session, as devin --resume <id> does; a plain devin shows the live terminal. Any other program in a herdr pane gets the live terminal and its status. Supported agents →

Does it replace herdr's own TUI?

No. Both attach to the same terminals at the same time, so the pane stays live at your desk, in the browser and on the phone. Nothing is stopped or handed over. TUI and browser →

Do I need Tailscale?

No. Tailscale, an SSH tunnel, a VPN or your own HTTPS proxy can provide a route to the PC. Installation and push alerts need a secure context such as HTTPS or localhost; basic browsing also works over plain HTTP on a LAN. The options →

Does my code or conversation leave my machine?

Session files stay on the PC running each agent, and their contents are served to browsers you connect. The app has no hosted relay or account service of its own. Optional voice input sends audio (and text when polishing) to the configured provider; enabled usage meters contact provider APIs. Updates, remote-PC setup and push alerts can also use external services. The app sends an anonymous count when it is installed and each time it is updated (the version, the OS, how it was installed and a random ID; no IP address is stored), and Settings → About → Anonymous usage counts shows what is sent and turns it off. The agents’ own model connections depend on their configuration. Data flow and access →

Does it work on Windows?

Yes, on Windows x64 without WSL. Until herdr can attach a terminal there, the terminal is a screen mirror with typing and a fixed grid.

How is it different from collie, roamgate or herdr-remote?

These are other phone or browser clients for herdr. This one reads the agent's own transcript, so a pane is a chat with the work folded per turn rather than terminal output, and other PCs join over SSH from the sidebar. It brings no tunnel and drives only herdr: if you want tmux or zellij, diffs, Telegram or a tunnel out of the box, one of the others is the better fit. The full comparison →

How is it different from Happy, Paseo or CloudCLI UI?

Those projects provide their own ways to start or manage agent sessions. This app works with the herdr panes you already run, keeping the same terminals available in the TUI and browser. If you do not use herdr, compare those projects’ deployment options and agent support. The full comparison →

docs

Start with the user guide: quick start · supported agents · features · phone · remote PCs · access and safety · configuration · keyboard shortcuts · FAQ.

For a closer look: how it works · chat transcripts · terminal flow control · app updates · changelog.

thanks

Built on herdr, with inspiration from chatmux, and powered by xterm.js, React, Bun and Lucide.

Thanks to everyone who has contributed, including @Yoonwoo-Ha.

agent instructions

Helping someone install the app? Follow INSTALL.md. For repository changes, follow CONTRIBUTING.md, the review rules and AGENTS.md.

development

git clone https://github.com/devswha/herdr-web-ui.git
cd herdr-web-ui
bun install

bun run server      # API + WebSocket on :7317
bun run dev         # Vite on :5173; run in a second terminal
bun run typecheck
bun run test:unit   # no herdr needed
bun test           # isolated herdr test session
bun run test:ui    # browser regression checks

See CONTRIBUTING.md to send a change, development for tests, media and releases, and DESIGN.md for UI conventions. Report security problems privately: SECURITY.md.

license

MIT. Copyright © 2026 devswha.

About

Browser and phone client for herdr: chat and live terminal for every agent pane, remote PCs over SSH, web push alerts

Topics

Resources

Code of conduct

Contributing

Security policy

Stars

710 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages