Compositing a Product Into a Photo, Entirely in the Browser

By the onecue.ai team · August 11, 2026 · ~7 min read

Putting a product into a scene it was never photographed in is a routine need for anyone selling online: the item was shot on a white background, and the listing wants it on a desk, in a hand, or in a room. The usual routes are a studio shoot, an hour in Photoshop, or uploading both images to a service.

Our Product Placement tool takes a fourth route: everything runs in the browser tab, and neither image is ever uploaded. This article is about what that constraint changes — because it turns out to change the design more than it changes the output.

Why client-side is a feature, not an optimisation

Product photos before launch are commercially sensitive in a way that a photographed menu is not. An unreleased item, a packaging revision, a collaboration under embargo — these are exactly the images people hesitate to upload to a free web tool, and reasonably so.

Running in the browser removes the question entirely. There is no upload to reason about, no retention policy to trust, no account required. That is a different kind of guarantee from "we delete your files after 30 days": it is a claim you can verify by watching your own network tab.

The practical costs are real and worth stating. The first run downloads a background-removal model, so there is a wait the first time and none afterwards. Very large images are limited by the tab's memory rather than by a server's. And no processing can be resumed elsewhere — close the tab and the work is gone.

The three steps that make a composite look real

Pasting a cutout onto a background never looks right, and the reasons are consistent enough to enumerate. Three corrections do most of the work.

1. The cutout

Background removal is the step people think of, and the one that has become reliable: a segmentation model separates subject from background well enough that manual masking is rarely needed for a product on a plain backdrop.

Where it still struggles is where it always has — hair, fur, transparency, and reflective edges. A glass bottle against a white background has no clean boundary to find, because much of the "background" is visible through the product. No amount of model quality removes that ambiguity; it is genuinely undecidable from a single image.

2. Tone matching

This is the step most tools skip, and the one that gives away a fake composite fastest. A product shot under studio strobes is neutral and bright. A room photo is warm from tungsten, cool from an overcast window, or green from fluorescents. Paste one into the other unmodified and the product reads as a sticker — the viewer cannot always say why, but the mismatch registers.

Matching the product's tone toward the destination scene's is a small adjustment with a large effect. It does not need to be physically accurate; it needs to remove the discontinuity that makes the eye suspicious.

3. The contact shadow

An object with no shadow appears to float regardless of how well it is cut out. The fix is not a full lighting simulation — that requires geometry the image does not contain — but a soft shadow where the object meets the surface. The eye is looking for evidence of contact, and a soft dark gradient under the base provides it.

Getting this subtle is more important than getting it accurate. An overdone shadow is more conspicuous than none.

Positioning belongs to the user

A design decision worth defending: the tool does not decide where the product goes. You click the spot and adjust the size with a slider.

Automatic placement is technically feasible — find a flat surface, estimate scale, drop the object there. It is also wrong most of the time, in the specific sense that the person composing the image has an intent the algorithm cannot see. Which part of the scene stays visible, where the product sits relative to the model's hand, how much negative space the layout needs. A click communicates all of that instantly, and no amount of scene understanding replaces it.

The general principle: automate the parts that are tedious and objective (cutting out, tone, shadow), and leave the parts that encode intent to the person who has it.

What this does not replace

Being clear about the boundary, since "AI replaces studio photography" is a common overstatement:

Hero shots still want a studio. Controlled lighting on the actual product, with the reflections and material response that come from real light, is not something a composite reproduces.
The product must already be photographed well. Compositing moves a good product photo into a new context; it does not improve a bad one. A soft-focus, badly lit source stays soft and badly lit in its new scene.
Physical interaction is out of reach. A hand gripping the product, fabric draping over it, liquid poured into it — these need the object and the scene to have been photographed together.
Accuracy claims are yours to keep. Marketplaces expect listing images to represent the product truthfully. A composite that implies a scale, a colour, or an included accessory that differs from reality is a problem regardless of how it was made.

Where it genuinely wins is volume and iteration: forty listings that each need the same product in a different context, or a dozen background options to choose between before committing to a shoot.

Practical advice

Shoot the product on a plain, contrasting background. White on white is the hardest case for segmentation; a mid-grey backdrop under a light product gives a much cleaner edge.
Match the camera angle before you match anything else. A product shot from above cannot be composited convincingly into a scene photographed at eye level. Perspective is the one mismatch no post-processing corrects.
Keep the light direction consistent. If the scene is lit from the left, a product lit from the right will look wrong even with tone matching and a shadow.
Zoom in on the edges before you publish. Segmentation artefacts hide at 100% view and appear on a retina display.

You can try it at Product Placement — drop a scene photo and a product photo, click where it goes, and download the result. No sign-in, and nothing leaves your device.