by u-ichi
Claude Code / Codex CLI plugin for generating reviewable HTML documents with preview, inline review comments, and agent feedback ingestion.
# Add to your Claude Code skills
git clone https://github.com/u-ichi/reviewable-html-workbenchGuides for using ai agents skills like reviewable-html-workbench.
reviewable-html-workbench is an open-source ai agents skill for AI coding assistants such as Claude Code, Codex CLI, and ChatGPT, built by u-ichi. Claude Code / Codex CLI plugin for generating reviewable HTML documents with preview, inline review comments, and agent feedback ingestion. It has 103 GitHub stars.
reviewable-html-workbench's catalog security scan is still queued. You can run an instant dependency and prompt-injection check now with the "Scan for vulnerabilities" button above.
Clone the repository with "git clone https://github.com/u-ichi/reviewable-html-workbench" and add it to your Claude Code skills directory (see the Installation section above).
reviewable-html-workbench is primarily written in Python. It is open-source under u-ichi on GitHub, so you can review or fork the full source.
Yes. SkillsLLM lists many other AI Agents skills you can browse and compare side by side. Open the AI Agents category from the badge at the top of this page, or use the Related Skills and comparison links further down to weigh reviewable-html-workbench against similar tools.
No comments yet. Be the first to share your thoughts!
Unlocks once the catalog security scan passes (runs nightly).
The deep catalog scan for this skill is still queued. Run an instant dependency check now instead.
A Claude Code / Codex CLI plugin that lets you review agent-generated HTML documents with inline comments — and have the agent read those comments, reply, and improve the document in the next iteration.

Agent workflows produce reports, design documents, and comparison tables — but turning those outputs into something you actually trust requires back-and-forth review. Chat-based feedback loses context: "fix the table in section 3" works once, but doesn't scale when you have dozens of comments across a long document.
Reviewable HTML Workbench solves this by putting the review conversation inside the document itself:
Comments are attached to exact document ranges and persisted as structured JSON, so nothing is lost between iterations. When you're satisfied, export the final document as a single self-contained HTML file.
The plugin includes two skills. visual-html-renderer creates, validates, renders, and previews visual HTML documents. reviewable-design-doc builds review-ready design documents and ingests review comments back into the agent workflow — including agent replies, comment classification, and review-cycle state tracking.
annotations/comments.json, classifies each comment (actionable, clarification, already addressed, etc.), writes agent replies, and tracks review-cycle state — so the review conversation stays structured across iterations.index.html, copied assets, and renderer-manifest.json.127.0.0.1; 0.0.0.0 bind is rejected.Add the GitHub repository as a plugin marketplace and install:
claude plugin marketplace add u-ichi/reviewable-html-workbench
claude plugin install reviewable-html-workbench
Alternatively, clone the repository and install locally:
git clone https://github.com/u-ichi/reviewable-html-workbench.git
cd reviewable-html-workbench
claude plugins install .
For local development, run Claude Code with this plugin directory:
claude --plugin-dir /path/to/reviewable-html-workbench
Add the GitHub repository as a plugin marketplace and install:
codex plugin marketplace add u-ichi/reviewable-html-workbench
codex plugin install reviewable-html-workbench
Or clone and register locally:
git clone https://github.com/u-ichi/reviewable-html-workbench.git
codex plugin marketplace add ./reviewable-html-workbench
Create a document model from source text:
python3 -m scripts.html_review_workbench.cli build-model \
--text "Write a short reviewable design note." \
--title "Example Design Note" \
--document-id example-design-note \
--output output/tmp/example/document-model.json
For final HTML output, agents should refine the document model directly before rendering. Then validate and render it:
python3 -m scripts.html_review_workbench.cli check-model \
--model output/tmp/example/document-model.json
python3 -m scripts.html_review_workbench.cli render \
--model output/tmp/example/document-model.json \
--output output/tmp/example/bundle
python3 -m scripts.html_review_workbench.cli validate \
--root output/tmp/example/bundle
Start a preview server:
python3 -m scripts.html_review_workbench.cli preview \
--root output/tmp/example/bundle \
--mode auto
After human review, ingest comments from the generated bundle:
python3 -m scripts.html_review_workbench.cli ingest-review \
--root output/tmp/example/bundle
| Skill | Purpose | Trigger examples |
|---|---|---|
visual-html-renderer |
Generate, validate, and preview final HTML bundles from document models. | html出力して, HTMLにして, HTMLで出して, この内容をHTMLで出して, HTMLでプレビューして, HTMLレンダラー, HTML出力を共通化, 図示つきHTML, visual HTML renderer |
reviewable-design-doc |
Create review-ready design documents and ingest review comments back into the workflow. | レビュー可能な設計資料, 設計資料をHTMLで, design doc, reviewable design doc, レビュー終わったので確認して, コメントを反映して |
All commands are exposed through:
python3 -m scripts.html_review_workbench.cli <command>
| Command | Description |
|---|---|
build-model |
Build a document model from natural content. |
render |
Generate an HTML bundle from a document model. |
check-model |
Check whether a document model is ready for final HTML rendering. |
attach-image |
Attach a generated image asset to an image-capable block in a document model. |
preview |
Start or describe a session-scoped preview runtime. |
ingest-review |
Read review comments, classify them, write agent replies, and save review-cycle state. |
validate |
Validate a generated HTML bundle. |
The workbench is schema-driven:
schemas/document-model.schema.jsonschemas/comments.schema.jsonschemas/preview-session.schema.jsonThese schemas define the rendered document model, persisted review comments, and preview session metadata.
Requirements:
unittestRun tests:
PYTHONPYCACHEPREFIX="$PWD/tmp/python-pycache" python3 -m unittest discover -s tests
Validate plugin manifests:
python3 -m json.tool .claude-plugin/plugin.json >/dev/null
python3 -m json.tool .codex-plugin/plugin.json >/dev/null
Validate the Claude Code plugin manifest:
claude plugins validate .
Check the CLI entrypoint:
python3 -m scripts.html_review_workbench.cli --help
MIT
Reviewable HTML Workbench は、Claude Code / Codex CLI 向けの HTML レビュー用プラグインです。agent が生成した設計資料・調査レポート・比較表を HTML で出力し、本文の任意の箇所にレビューコメントを書き込めます。agent はそのコメントを読み取り、返信し、内容を改善して再出力します。コメントと改善を繰り返して、ドキュメントを一緒に磨き上げるワークフローを実現します。
完成したら、レビュー要素を除いた読者向けの HTML を 1 ファイルでダウンロードできます(CSS・画像埋め込み済み、OS テーマ自動検知対応)。
2つの skill を含みます。
visual-html-renderer: HTML生成、図示、Preview Runtime、bundle検証。reviewable-design-doc: レビュー可能な設計資料作成、コメント取り込み、agent返信、設計反映。インストール:
# Claude Code(GitHub から直接)
claude plugin marketplace add u-ichi/reviewable-html-workbench
claude plugin install reviewable-html-workbench
# Codex CLI(GitHub から直接)
codex plugin marketplace add u-ichi/reviewable-html-workbench
テストは次のコマンドで実行します。
PYTHONPYCACHEPREFIX="$PWD/tmp/python-pycache" python3 -m unittest discover -s tests