Render Compositor

100%

Render Compositor

Drop images here to start, or add them from the Layers panel.

Layers

Bottom layer sets the canvas size. Alt‑click an eye to solo. Paint layers are empty canvases for colour fixes.

Layer

Name

Opacity100%

Blend

R°

Arrows nudge 1px (⇧ 10px). ⌥↑/↓ scale ±0.1%, ⌥←/→ rotate ±0.05°.

Alignment

Search ±px

Scale ±%

Lock scale Weight by revealed area

Tip: paint a rough mask over the region that matters (e.g. the street), then auto‑align. It aligns edges only where the layer is revealed.

Purpose

Tool

Target

Colour

Sample

Aligned

⌥‑click the good area to set a source, then paint over the bad area. Copies from the layers below the selected paint layer, using the brush size, hardness and flow.

Size140

Hardness35%

Flow100%

[] size · ⇧[⇧] hardness · ⌥ swaps reveal/hide · ⇧‑click for straight lines

Action

Feather24px

Combine

Drag from the point that should fully apply to where the effect ends. Great for "show the bottom of this image".

Allow scale Allow rotation

Click a feature on the reference, then the same feature on the selected layer. One pair moves; two or more also scale/rotate.

Drag the selected layer. Corner handles scale (⌥ from center); the top handle rotates.

Mask

Feather

ChatGPT round‑trip show boxes

Press W and drag a box around the area to rework. Export gives you a PNG crop plus a ready prompt; generate in ChatGPT, then Place result drops the new image back exactly there as a masked layer.

No regions yet.

Name

Change

Prompt

Options

Snap box to

Also export a context imagemargin%

Blend edgepx, when placing the result

Append the material reference guide to the prompt file

Auto‑align placed results (small search)

Project

JPEG q94

Autosaves to this browser.

Agent access

Starting…

How to connect an agent

Chrome, native. Enable chrome://flags/#enable-webmcp-testing, relaunch, reload this page. WebMCP-aware agents and the Model Context Tool Inspector extension then see the tools.
Claude Code / Claude Desktop, via a bridge. Launch Chrome with a debugging port, open this page in it, then run a WebMCP‑to‑MCP bridge such as webmcp-cdp-bridge:
```
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-agent
```
```
claude mcp add compositor -e TARGET_URL=localhost:8765 -- bun run /path/to/webmcp-cdp-bridge/src/index.ts
```
Works with or without the flag: without it, this page installs a shim on document.modelContext with the same getTools() / executeTool() surface.
Playwright or any CDP script. Evaluate document.modelContext.getTools() and document.modelContext.executeTool(name, args) in this tab.

Every call is checked against the switches below and appears in the log.

Actions allowed

Untick an action to block it. Blocked calls are refused with an error the agent can read. Click a name for details.

Call log

Newest first. Click a call to see its timing, arguments and result.

No calls yet.