WerkWorks
DE Contact
Menu
← All products
Open Source v1.2.1 ↗

nudgit

Your UI. Your feedback. Agent-ready.

Edit, move and annotate elements directly in your browser. Turn visual feedback into actionable instructions for your coding agent. A screenshot with red arrows rarely explains exactly what should change, and a coding agent cannot read red arrows anyway. nudgit lays an overlay over any running web app: click elements, edit text and descriptions, move, duplicate, add from a palette of similar elements, remove, or comment right on the page.

The result is a compact change list, ui-changes.md, readable by people and machine-readable as JSON, with several locators per element (selector, accessible name, text, HTML snippet, breadcrumb, URL). A coding agent such as Claude Code or Codex implements it exactly in the source code. nudgit itself never writes to the target app's code.

Visual editingAgent-readyOpen sourceMIT License

How it works

How it works: enter a URL, mark changes in the overlay, export ui-changes.md and let a coding agent implement it On the start page you enter the URL of the running web app; a local proxy places the overlay on top, even when the app sets CSP or X-Frame-Options. In the overlay you click elements, edit text, move, duplicate, add from a palette of similar elements, remove or comment. Exporting bundles everything into ui-changes.md, which a coding agent implements in the source code. Start & URL local proxy · any web app Mark changes text · move · duplicate · comments ui-changes.md Markdown + JSON · for coding agents

See it in action

An element selected in a web app with nudgit
Select any element: the hover box shows what you will pick; the selection gets quick icons to rename, move and comment.
nudgit change list next to the previewed page
Every change in one list: text and description edits, moves, removals, duplicates and comments, previewed right on the page.
Commenting on a button with nudgit
Comments for everything else, such as layout or style requests, attached to the element.
The exported ui-changes.md file
The result: ui-changes.md states what to do first, then where, with several locators per element for your coding agent.

Features

  • Overlay via a local proxy — also works with apps that set CSP or X-Frame-Options
  • Browser extension for Chrome and Edge: the same overlay right on the real page, without a proxy, for example for apps behind an SSO login or on remote servers
  • Edit right on the real page: change text and descriptions, drag & drop to move, duplicate, add from a palette of similar elements, remove or comment, with quick-access icons per element
  • Robust element identification with several locators: selector, accessible name, text, HTML snippet, breadcrumb and URL
  • Exports as ui-changes.md — Markdown for humans and JSON for coding agents such as Claude Code or Codex, which implement the changes exactly in the source code
  • Pick up where you left off: import a saved ui-changes.md or JSON file, replacing or appending to the current list
  • The app's API calls to local backends and allowed hosts go through the proxy too, so CORS checks do not get in the way; bring your own CA certificate for internal HTTPS servers
  • A start page with the URL, a save location for ui-changes.md and recently used URLs, plus a macOS app with its own Dock icon
  • Runs fully local: no cloud, no login, no telemetry; by default the proxy is reachable only from your own machine
  • English and German UI; ui-changes.md is always in English, since it is meant for coding agents
Portrait illustration of the founder of WerkWorks

Write to me

Whether you have product feedback or want to discuss working together, your message comes straight to me. I reply myself.

info [at] werkworks [punkt] de +49 1​76 48​99​30​12