Annotate and review coding agent plans and code diffs visually, share with your team, send feedback to agents with one click.
Plannotator is a browser-based review interface for AI coding agent plans and code diffs, supporting Claude Code, Copilot CLI, Gemini CLI, OpenCode, Codex, Pi, Droid, and Amp. It installs into Claude Code as a plugin via the marketplace and adds a built-in hook that automatically opens agent plans in the browser during plan mode, where reviewers can approve or deny proposals, add inline annotations, and consult an Ask AI side chat. Slash commands handle additional workflows: `/plannotator-review` renders git diffs or GitHub pull requests with annotation support, and `/plannotator-annotate` opens any markdown file, folder, or URL for annotated feedback that is sent back to the agent in one click. Team collaboration works through shareable encrypted links where small plans encode entirely in the URL hash, while larger plans use AES-256-GCM zero-knowledge storage with auto-deletion after seven days. The tool is self-hostable and ships with SHA256 verification plus SLSA provenance support from version 0.17.2 onward. It primarily benefits developers and teams who want human review checkpoints built into agentic coding workflows.
- ✓Open-source license (Apache-2.0)
- ✓Actively maintained (<30d)
- ✓Healthy fork ratio
- ✓Clear description
- ✓Topics declared
- ✓Documented (README)
- !Install pipes a remote script into a shell (curl | sh)
git clone https://github.com/backnotprop/plannotator10 items en este repositorio
Guard against breaking the @pierre/diffs integration in Plannotator's code review UI. Use this skill whenever modifying DiffViewer.tsx, upgrading the @pierre/diffs package, changing unsafeCSS injection, adding new props to FileDiff, or touching shadow DOM selectors or CSS variables that cross into Pierre's shadow boundary. Also trigger when someone asks "will this break the diff viewer", "is this safe to change", or when reviewing PRs that touch the review-editor package.
Prepare and execute a Plannotator release — draft release notes with full contributor credit, bump versions across all package files, build in dependency order, and kick off the tag-driven release pipeline. Use this skill whenever the user mentions preparing a release, bumping versions, writing release notes, tagging a release, or publishing. Also trigger when the user says things like "let's ship", "prep a release", "what's changed since last release", or "time to cut a new version".
Review Renovate bot PRs that update GitHub Actions dependencies. Verifies supply chain integrity by checking pinned commit SHAs against upstream tagged releases, reviews changelogs for breaking changes, and confirms compatibility with existing workflow configurations. Use when a Renovate PR updates GitHub Actions in .github/workflows/.
Audit and update npm/Bun dependencies with supply chain integrity checks — verifies maintainers, publish age, tarball diffs, and provenance before bumping. Defers risky packages to ~/.supply-chain/notes/.
Open Plannotator's annotation UI for a markdown file, converted HTML file, URL, or folder and then respond to the returned annotations.
Open Plannotator's browser-based code review UI for the current worktree or a pull request URL, then act on the feedback that comes back.
Open Plannotator on the latest rendered assistant message and use the returned annotations to revise that message or continue.
Turn an idea or objective into a goal package for /goal. Interviews the user, builds a reviewed fact sheet via Plannotator, then explores the codebase to produce an execution plan.
Resumen de Tools
<p align="center">
<img src=".github/assets/banner.webp" alt="Plannotator" width="640" />
</p>
<p align="center">
<strong>Everything you need to annotate and stay in the loop with your agents</strong><br/>
<strong>Markdown Review • Code Review • HTML Artifacts</strong><br/>
<sub>Annotate plans, specs, markdown, and HTML before implementation. Review diffs and PRs. Send feedback to your agent.</sub>
</p>
<p align="center">
<img src=".github/assets/icons/amp.svg" alt="Amp" title="Amp" height="28" />
<img src=".github/assets/icons/claude.svg" alt="Claude Code" title="Claude Code" height="28" />
<img src=".github/assets/icons/codex.png" alt="Codex" title="Codex" height="28" />
<picture>
<source media="(prefers-color-scheme: dark)" srcset=".github/assets/icons/copilot-dark.svg" />
<img src=".github/assets/icons/copilot-light.svg" alt="Copilot CLI" title="Copilot CLI" height="28" />
</picture>
<img src=".github/assets/icons/droid.png" alt="Droid" title="Droid" height="28" />
<img src=".github/assets/icons/gemini.png" alt="Gemini CLI" title="Gemini CLI" height="28" />
<img src=".github/assets/icons/kiro.svg" alt="Kiro" title="Kiro" height="28" />
<picture>
<source media="(prefers-color-scheme: dark)" srcset=".github/assets/icons/opencode-dark.svg" />
<img src=".github/assets/icons/opencode-light.svg" alt="OpenCode" title="OpenCode" height="28" />
</picture>
<picture>
<source media="(prefers-color-scheme: dark)" srcset=".github/assets/icons/pi-dark.svg" />
<img src=".github/assets/icons/pi-light.svg" alt="Pi" title="Pi" height="28" />
</picture>
</p>
<p align="center">
<a href="https://www.youtube.com/watch?v=a_AT7cEN_9I">Watch the og demo</a> · <a href="https://docs.plannotator.ai/open-source/start/installation">Installation guide</a> · <a href="https://plannotator.ai/">Official site</a> · <a href="https://github.com/plannotator/effective-html">Visual HTML Skills</a> · <a href="#herdr-annotate-plannotator-in-the-terminal">Herdr Annotate</a>
</p>
# Plannotator
Plannotator is a local, browser-based review surface for AI coding agents: Claude Code, Codex, Copilot CLI, Gemini CLI, OpenCode, Kiro, Droid, Amp, and Pi.
**It plugs directly into your agent** through its hooks and commands. When the agent proposes a plan, html, or finishes writing code, the work opens in your browser and you mark it up, comment, and send feedback directly to the agent for it to act on it.
<table>
<tr>
<td width="40%" valign="middle">
### Review documents, plans, and agent messages
Annotate plans, specs, messages, html, then send the feedback to your agent.
<p><strong>Demo:</strong> <a href="https://youtu.be/XqFun9XCXPw">Plan review with Pi</a></p>
</td>
<td width="60%">
<img src=".github/assets/annotate.webp" alt="Annotate UI with inline annotations" width="100%" />
</td>
</tr>
<tr>
<td width="40%" valign="middle">
### Code Review
Review local changes or remote PRs. Comment on diffs, suggest code. Your comments go back to the agent. Works with Git, GitButler, Jujutsu (`jj`), Perforce (`p4`), GitHub, and GitLab.
</td>
<td width="60%">
<img src=".github/assets/review.webp" alt="Code review with file tree and side-by-side diff" width="100%" />
</td>
</tr>
</table>
<p align="center">
<sub><strong>AI built in:</strong> ask AI about anything you're reviewing,<br/>or launch AI reviews that post comments to the diff.</sub>
</p>
## Annotate HTML Artifacts
<p align="center">
<img src=".github/assets/html.webp" alt="Annotating a rendered HTML artifact" width="720" />
</p>
## Herdr Annotate: Plannotator in the Terminal
<p align="center">
<a href="https://github.com/plannotator/herdr-annotate">
<img src=".github/assets/herdr-annotate-banner.svg" alt="Herdr Annotate" width="300" align="middle" />
</a>
<img src=".github/assets/herdr-annotate.png" alt="Plannotator TUI annotating a markdown folder in the terminal" width="480" align="middle" />
</p>
[Herdr Annotate](https://github.com/plannotator/herdr-annotate) brings Plannotator-style review to the terminal: annotate terminal text, review whole Markdown documents and your coding agent's replies inside [Herdr](https://herdr.dev), and send the feedback straight back to the agent as its next message. Works with Claude Code, Codex, Pi, Copilot CLI, and Droid replies. Annotations are saved in the Plannotator data directory, so terminal reviews and app reviews compound.
```
herdr plugin install plannotator/herdr-annotate
```
Prefer it standalone? [Plannotator TUI](https://github.com/plannotator/plannotator-tui) powers the document review and runs without Herdr: `brew install plannotator/tap/plannotator-tui`.
---
## Commands
<sub>On Codex, swap the slash commands for `!plannotator …` (e.g. `!plannotator review`) or the `$plannotator-*` skills.</sub>
### Annotate
```
/plannotator-annotate README.md # Local markdown file
/plannotator-annotate src/ # Browse and annotate files in a folder
/plannotator-annotate https://docs.rs/… # Fetch and annotate any URL
/plannotator-annotate report.html --render-html # Render HTML as-is instead of converting
/plannotator-last # Annotate the agent's last message
```
Need a realistic document to try? Copy the [product requirements document template and filled example](https://docs.plannotator.ai/templates/product-requirements-document) as Markdown.
### Code review
```
/plannotator-review # Review uncommitted changes
/plannotator-review <github-pr-url> # Review a GitHub pull request
/plannotator-review <gitlab-mr-url> # Review a GitLab merge request
plannotator review --gitbutler # Review an active GitButler workspace
```
GitButler users can review the whole workspace, one stack, or one branch layer. See the [GitButler workflow guide](https://docs.plannotator.ai/open-source/workflows/gitbutler).
### Plan mode
No command needed. Plan mode is wired in through each harness's hooks. Any time your agent creates a plan, the markdown review surface opens for you.
### CLI
```
plannotator sessions # List active Plannotator sessions
plannotator sessions --open 1 # Reopen a session in the browser
plannotator archive # Browse saved plan decisions read-only
```
---
## Privacy and network behavior
Plannotator does not collect usage telemetry or analytics. Plans, diffs, annotations, drafts, history, and configuration stay local by default.
Each plan review, annotate, archive, share-portal, and code-review app surface checks GitHub for the latest Plannotator release when it loads. This sends no plan or review content and gives the Plannotator project owner no usage analytics, although GitHub receives an ordinary request. There is currently no opt-out setting. Local Git code review can also query the configured `origin` with `git ls-remote` to detect the default branch and a stale baseline; it does not send the local diff.
Content leaves the local workflow only when a network feature needs it:
- URL annotation fetches the requested site, through Jina Reader by default for public pages or directly when Jina is disabled or unavailable.
- GitHub and GitLab review uses your authenticated CLI and Git remote to retrieve PR or MR data.
- Ask AI and review agents send the selected question and relevant plan, document, repository, or diff context to your configured provider.
- Sharing sends the complete link to whoever or whatever service you use to deliver it. Encrypted short links upload ciphertext to the paste service.
- Workspaces is a separate hosted product, so the open source app's local-storage model does not apply to content placed there.
The [privacy policy](https://plannotator.ai/privacy) documents these boundaries and the hosted website and waitlist data.
---
## Link sharing
Open source asynchronous link sharing remains available for compatibility but is moving to deprecated support. Workspaces is the primary direction for team sharing. No removal date has been announced.
<p align="center">
<a href="https://room.plannotator.ai/">
<img src=".github/assets/sharing.png" alt="Sharing portal with upload options" width="720" />
</a>
</p>
<p align="center">
<sub>Legacy link-sharing demo: <a href="https://room.plannotator.ai/">room.plannotator.ai</a></sub>
</p>
<p align="center">
<a href="https://plannotator.ai/workspaces">
<img src=".github/assets/workspaces-cta.svg" alt="Workspaces is the team-sharing direction. Join the waitlist." height="44" />
</a>
</p>
Share a plan with a teammate and they can annotate it themselves. Import their feedback and send it straight back to your agent.
**Small markdown shares** are compressed into the URL fragment. The fragment is not included in the browser's request to the share portal, but it is not encrypted. Anyone or any messaging service with the complete link can read the shared content. The portal host still receives ordinary request metadata.
**Large markdown and raw HTML shares** use a short-link service. The share payload is encrypted with AES-256-GCM before upload, the server stores only ciphertext, and the key is kept in the URL fragment rather than sent in the paste request. Anyone with the complete link can decrypt it. Hosted pastes expire after 7 days.
Same model as [PrivateBin](https://privatebin.info/). The paste service is [self-hostable](https://docs.plannotator.ai/open-source/workflows/sharing).
Sharing can be disabled entirely with `PLANNOTATOR_SHARE=disabled`.
[Workspaces](https://plannotator.ai/workspaces) is the primary path for hosted team collaboration.
---
## Install
One installer covers almost every agent. It installs the `plannotator` binary, auto-detects your installed agents, and configures hooks, skills, and slash commands fLo que la gente pregunta sobre plannotator
¿Qué es backnotprop/plannotator?
+
backnotprop/plannotator es tools para el ecosistema de Claude AI. Annotate and review coding agent plans and code diffs visually, share with your team, send feedback to agents with one click. Tiene 8.6k estrellas en GitHub y su última actualización registrada es del 2026-09-11.
¿Cómo se instala plannotator?
+
Puedes instalar plannotator clonando el repositorio (https://github.com/backnotprop/plannotator) o siguiendo las instrucciones del README en GitHub. ClaudeWave también te ofrece bloques de instalación rápida en esta misma página.
¿Es seguro usar backnotprop/plannotator?
+
Nuestro agente de seguridad ha analizado backnotprop/plannotator y le ha asignado un Trust Score de 97/100 (tier: Verified). Revisa el desglose completo de comprobaciones superadas y flags en esta página.
¿Quién mantiene backnotprop/plannotator?
+
backnotprop/plannotator es mantenido por backnotprop. La última actividad registrada en GitHub es del 2026-09-11, con 154 issues abiertos.
¿Hay alternativas a plannotator?
+
Sí. En ClaudeWave puedes explorar tools similares en /categories/tools, ordenados por popularidad o actividad reciente.
Despliega plannotator en tu cloud
Lleva este repo a producción en minutos. Cada plataforma genera su propio entorno con variables de entorno editables.
¿Mantienes este repo? Añade un badge a tu README
Pega el badge en tu README de GitHub para mostrar que está auditado por ClaudeWave. Cada badge enlaza de vuelta a esta página y muestra el Trust Score actual.
[](https://claudewave.com/repo/backnotprop-plannotator)<a href="https://claudewave.com/repo/backnotprop-plannotator"><img src="https://claudewave.com/api/badge/backnotprop-plannotator" alt="Featured on ClaudeWave: backnotprop/plannotator" width="320" height="64" /></a>Más Tools
A single CLAUDE.md file to improve Claude Code behavior, derived from Andrej Karpathy's observations on LLM coding pitfalls.
An AI skill that provides design intelligence for building professional UI/UX across multiple platforms.
🪨 why use many token when few token do trick — Claude Code skill that cuts 65% of tokens by talking like caveman
CLI proxy that reduces LLM token consumption by 60-90% on common dev commands. Single Rust binary, zero dependencies
The fastest, litest AI Gateway. Rust core with Python SDK. Call 100+ LLM APIs in OpenAI (or native) format with cost tracking, guardrails, load balancing, and logging [Bedrock, Azure, OpenAI, Anthropic, OpenAI, VertexAI, vLLM, Nvidia NIM]
Use Claude Code, Codex, Pi, and OpenCode and more for free (1.3B+ free tokens) from your terminal, app, IDE, or phone like OpenClaw (voice supported + ToS friendly)