Combine Images Side by Side

Want to show a before and after? Use our horizontal merge tool to perfectly stitch two images together seamlessly in your browser.

Last updated: August 2026

Drop your images here or click to select

Supports JPG, PNG, WebP and AVIF

Placing two images side by side is the fastest way to make a comparison argue for itself. A before and after, two product options, a design revision against the original — the point of the format is that a viewer sees both at once and draws the conclusion without being told. That only works when the two halves are genuinely comparable, and that is a preparation problem rather than a merging one.

The mechanics are simple: the tool places images in a horizontal row at their own native resolution, in the order you arrange the thumbnails, with an optional gap between them. What it does not do is resize either image to match the other. Feed it two photos of different heights and the shorter one is centred vertically with background colour filling above and below — undistorted, which is correct, but visually lopsided in a way that undermines the comparison.

So the useful rule for a side-by-side is to equalise heights first. Two images of the same height sit flush with no filler and each occupies the width its content deserves. If they also share the same width, the result is a clean symmetrical pair, which is what a before-and-after usually wants. A single resize pass before merging does more for the finished comparison than any setting in the merge itself.

How to combine two images side by side

  1. 1

    Match the heights first

    Resize both images to a common height before you start. This is the step that decides whether the pair looks deliberate or improvised, and it takes one pass in Resize Image.

  2. 2

    Add both images

    Drop them in together. They appear as thumbnails in the order they will be placed, and everything runs in your browser without uploading.

  3. 3

    Set the direction to horizontal

    This places them in a row rather than stacking them. Drag the thumbnails to decide which one is on the left — for a before and after, the before goes first, because that is the reading direction.

  4. 4

    Add a gap if they need separating

    A small gap makes it clear these are two images rather than one continuous scene. Zero works when the two halves are meant to read as a single frame. Then merge and download.

Pro tip: For a genuine before and after, keep everything except the change identical. Same framing, same distance, same lighting, same crop. A comparison where the after shot is also closer, brighter and better composed proves nothing except that you took a better photo the second time — and viewers notice. If the two shots were taken at different distances, cropping both to the same framing before merging is what restores the comparison, and it matters far more than any merge setting.

Troubleshooting: If one image sits in a band of background colour, the two have different heights — resize to match and the filler disappears. If the pair looks unbalanced despite matching heights, the widths differ, which is fine for photographs of different subjects but distracting for a before and after. If text or fine detail looks soft, the export was JPEG because a white or black background was selected; transparent produces PNG instead. If the images are in the wrong order, the merge follows the thumbnails, not the filenames.

For more than two images, Merge JPG Files Into One covers rows and stacks of any length, and Stitch Screenshots Together Online handles long vertical sequences. To get both halves framed identically before merging, Crop Photo to Custom Aspect Ratio. If the comparison belongs in a document, Combine Images into One PDF puts each on its own page. The full Merge Images tool covers the rest.

Frequently asked questions

How do I put two pictures side by side?

Add both images to the tool above, set the direction to horizontal, drag them into the order you want, and merge. They are placed in a row at full resolution with optional spacing between them, and the result downloads as a single image.

How do I make a before and after image?

Resize both photos to the same height, add them with the before image first, set the direction to horizontal, and merge with a small gap. Matching heights is the important part — it is what makes the two halves read as a fair comparison rather than two unrelated pictures.

Why is one of my images smaller than the other?

Because they have different dimensions and neither is scaled to match. The shorter image is centred with background filling the space, which avoids distortion but looks uneven. Resize both to a common height before merging and they sit flush.

Can I combine more than two images side by side?

Yes. The horizontal direction places any number of images in a row, in whatever order you arrange the thumbnails. Bear in mind that the result gets very wide very quickly, so three or four is usually the practical limit before the image becomes hard to view.

Are my images uploaded when I combine them?

No. The merge is drawn on a canvas in your browser and saved directly from there — nothing is uploaded, stored, or logged, and it works offline once the page has loaded.

Looking for the full-featured version? Open the main Merge Images tool.

Related Tools & Resources