All studies

Patch-based reconstruction

Texture transfer

Reconstructing the shape and tones of one image with the material of another. Every output pixel comes from the source texture.

JavaScript · Canvas · Web Workers · Image processing

View source on GitHub

Try it

Runs locally in your browser. Uploaded images are not sent anywhere.

Source material
Selected source texture
Texture sample
Selected target image
Target structure
PNG, JPEG or WebP, up to 12 MB. Images stay in your browser. Textures are center-cropped and sampled at 256 × 256 for processing.
Transfer settings
Higher structure favors the target’s tones. Smaller patches resolve finer details.
Example sculpture reconstructed from pebble patches

Example output. Choose settings, then run the study.

Every output pixel comes from the texture sample. The target only guides which patches are selected.

Material meets structure

A texture has its own local detail. A target image has an overall shape. The patch search has to satisfy both: match the neighboring material while choosing patches with the right light and dark structure.

  1. Build a guide. Smooth and normalize the luminance of the texture and target. Compare these guides when scoring a candidate patch.
  2. Balance the errors. Combine target correspondence with overlap error. The structure slider controls that tradeoff; the chosen patch keeps its original colors.
  3. Refine at a smaller scale. Reduce patch size by one third on each pass. Later passes also compare against the previous result, preserving its broad structure while resolving finer detail.

Read the original paper by Efros & Freeman

Computed examples

One target, two source materials.

Ivory sculpture against a dark background, used as the transfer target
Target · generated source photograph
The sculpture reconstructed with river pebble patches
Pebbles · three refinement passes
The same sculpture reconstructed with overlapping leaf patches
Foliage · three refinement passes

The source photographs were generated for these experiments. The results were computed by the same algorithm used above: 256 × 256 output, 36px initial patches, 6px overlap, three passes, 75% target structure, up to 384 candidates, seed 42. Published previews are compressed; PNG exports preserve the computed pixels.

What this version does—and where it stops

The expensive search runs in a Web Worker, with progressive previews and cancellation. A bounded, seeded sample of candidate patches keeps it practical in a browser. Larger candidate sets explore more of the source, at a higher processing cost.

Flat target regions can keep selecting similar patches, creating repeated rows. Strong structure matching can also break the natural continuity of the texture. Neither higher resolution nor a larger search guarantees a more convincing result.

Opposite edges are not constrained to match, so the output is not guaranteed to tile periodically. This is a classical patch-based method, with no neural model.