Annotate elements, draw regions, and ship cleaner UI faster.

onUI gives you two capture modes in one workflow: Annotate mode for element-level fixes and Draw mode for layout or spacing regions. The new compact toolbar design keeps primary actions in a minimal rail, while settings open in a focused pop-out card. With onui-local MCP connected, your agent can read fresh annotations and iterate continuously. No app code changes. No backend.

4 Export Formats
6 Local MCP Tools
0 Cloud Dependencies
1 Click Per-Tab Enable
Annotate + multi-select Draw mode regions Redesigned toolbar UI Zero Backend

Google Chrome

Install directly from Chrome Web Store for the fastest setup.

Microsoft Edge

Install directly from Edge Add-ons for the easiest setup.

Mozilla Firefox

Use the Firefox installer path, then load temporary add-on.

See onUI in action

Watch how annotation-driven AI workflows come together

Built for annotate + draw workflows

Element-level and region-level feedback in the redesigned compact toolbar

No integration work

Run on any supported webpage where content scripts can execute. No app instrumentation required.

Annotate mode for precise UI fixes

Target individual elements, attach intent and severity, and use Shift multi-select when one issue spans multiple components. The page freezes while annotating to keep element positions stable.

Draw mode for layout and spacing

Drag rectangle or ellipse regions to call out spacing, alignment, grouping, and layout problems that are bigger than one element.

New compact toolbar design

The redesigned floating rail stays small on-page, while settings open in a readable pop-out card for output level and clear-on-copy controls.

Local MCP server

Your agent can keep checking annotations via onui_get_report and onui_search_annotations, apply fixes, and repeat in a pair-programming loop.

Private by design

Your data stays local through native messaging plus a local store. No SaaS dependency required.

The AI pair-programming loop

You annotate once. Your agent keeps fixing in a loop.

01

Capture with Annotate or Draw

Use Annotate mode for single or multi-element feedback, or Draw mode to mark regions for layout and spacing issues.

02

Agent reads annotations

Your AI agent reads fresh annotations from local MCP tools like onui_get_report.

03

Fix, verify, iterate

Agent applies fixes, you review and add new annotations. Repeat until the UI is production-clean.

Works with Claude Code and Codex as a continuous, annotation-driven UI workflow.

Get up and running

Clear install paths for Chrome, Edge, and Firefox

Chrome and Edge install instantly from their stores. Firefox follows the browser-specific setup path below.

1

Pick your browser and follow one path

Fastest path

Chrome

Install directly from Chrome Web Store, then open any page and enable onUI for that tab.

Open Chrome Web Store
Want the latest version?

Use the installer for the most recent release (store updates may lag):

macOS/Linux

curl -fsSL https://github.com/onllm-dev/onUI/releases/latest/download/install.sh | bash

Windows PowerShell

irm https://github.com/onllm-dev/onUI/releases/latest/download/install.ps1 | iex
Fastest path

Edge

Install directly from Edge Add-ons, then open any page and enable onUI for that tab.

Open Edge Add-ons
Want the latest version?

Use the installer for the most recent release (store updates may lag):

macOS/Linux

curl -fsSL https://github.com/onllm-dev/onUI/releases/latest/download/install.sh | bash

Windows PowerShell

irm https://github.com/onllm-dev/onUI/releases/latest/download/install.ps1 | iex
Firefox-specific build

Firefox

Run the Firefox installer path, then load the temporary add-on using the generated Firefox manifest.

macOS/Linux

curl -fsSL https://github.com/onllm-dev/onUI/releases/latest/download/install.sh | bash -s -- --firefox

Windows PowerShell

iwr https://github.com/onllm-dev/onUI/releases/latest/download/install.ps1 -OutFile install.ps1; .\install.ps1 -Firefox

Every installer path can also set up onui-local. Enter y when prompted if you want the local MCP bridge registered too.

2

Finish the browser-side step

Chrome + Edge

  1. Open edge://extensions or chrome://extensions
  2. Enable Developer mode
  3. Click Load unpacked
  4. Select ~/.onui/extensions/current or %USERPROFILE%\.onui\extensions\current

Firefox

  1. Open about:debugging#/runtime/this-firefox
  2. Click Load Temporary Add-on...
  3. Select ~/.onui/extensions/current/manifest.json

Keyboard shortcuts

Quick access to annotation modes — works across all browsers

+ A

Toggle Annotate Mode

Click elements to annotate. Hold Shift to multi-select.

+ D

Toggle Draw Mode

Drag to draw rectangle or ellipse regions for layout feedback.

Customize shortcuts

Open chrome://extensions/shortcuts in Chrome, edge://extensions/shortcuts in Edge, or about:addons → gear icon in Firefox.

Frequently asked questions

Quick answers to common questions

Which browsers are supported in this release?

onUI now supports Google Chrome, Microsoft Edge, and Mozilla Firefox. Chrome installs from Web Store, while Edge and Firefox are available through unpacked/release-bundle install paths.

Can I enable onUI globally?

onUI is tab-scoped by design. New tabs start with onUI off. This gives you control over which pages have annotation overlays active.

Does onUI require a cloud backend?

No. The extension, native host, and MCP server all run locally on your machine. Your annotations never leave your device.

What export formats are available?

Four formats: compact (minimal), standard, detailed, and forensic (maximum context). Choose based on how much information your AI agent needs.

Why can't I scroll when annotate mode is on?

Annotate mode freezes the page intentionally. This keeps element positions stable while you click to annotate. To scroll, exit annotate mode first (click the button or press Alt+A / ⌥A), scroll to where you need, then re-enter annotate mode. Draw mode does not freeze the page.