“I want to share several screenshots as a single image.” “Can I put before and after photos side by side?” Combining images into one file makes sharing easier for both sides — but dedicated editors can be overkill for such a simple job.
This guide explains how image merging works, the two basic layouts, gap and background settings, and tips to avoid common mistakes. A free browser tool handles the merging without any uploads.
What Image Merging Is — Two Basic Layouts
Merging joins multiple images onto one canvas. There are two fundamental layouts:
| Layout | What it produces | Best for |
|---|---|---|
| Side by side | Images placed left to right | Before/after comparisons, horizontal sequences |
| Stacked | Images placed top to bottom | Scrolling captures, step-by-step instructions |
How sizes add up: Side by side, the width is the sum of the images plus gaps, and the height matches the tallest image. Stacked, it is the reverse. For example, images of 100 px and 200 px with an 8 px gap laid side by side make a 308 px-wide canvas.
Each image keeps its original size — nothing is scaled, so there is no quality loss from the merge itself. Images of very different sizes can leave noticeable empty areas, though; trimming or resizing them beforehand gives a cleaner result.
Practice: Stitching Screenshots
The most common use is joining scrolling screenshots. Phone scrolling captures often save as separate frames, so stacking them vertically recreates one long image:
- Save the screenshots in order: Adding numbers to the file names makes the order easy to verify later.
- Add 2 to 10 images to the merger: Drop them all at once. They are placed in the order you added them, and thumbnails show the sequence with numbers.
- Choose the layout and merge: Pick stacked, set the gap to 0 px for a seamless join, and download the result.
Gap tips: For stitched screenshots, a 0 px gap joins the frames seamlessly. For comparison images, an 8 to 16 px gap separates each photo so the boundaries stay clear. Note that JPEG output fills transparent gaps with white, while PNG keeps them transparent.
For comparison images, label which side is which — either with a small gap or by adding labels inside the images themselves. Small overlaps between captures can be trimmed before merging so the content does not repeat across the seam.
Format and Background Notes
PNG supports transparency, so a transparent gap stays transparent. JPEG cannot store transparency — transparent areas are filled with white. Images of formats such as HEIC (the default for some phone photos) are not supported directly; convert them to JPEG first.
Combining many high-resolution images produces a large canvas, and some devices may run out of memory. Downsizing the images with a resizing tool before merging keeps the process stable.
Merge Images with a Tool
The Tools Hub image merger combines 2 to 10 images with drag & drop. You can switch between side-by-side and stacked layouts, set the gap from 0 to 100 px, and choose PNG or JPEG output. Thumbnails show the order, and each image can be removed individually. Everything runs in your browser and images are never uploaded.
How to use it (3 steps)
Add 2 to 10 images
Open the merger and drop in the images. Thumbnails show the order, and the × button removes individual images.
Choose layout, gap and format
Pick side by side or stacked, set the gap, and select PNG or JPEG output.
Preview and download
The merged image appears as a preview. Download it as one combined file.
Tool mentioned in this article
Image Merger
2 to 10 images, horizontal or vertical, with gaps and format choice — free, in your browser.
If the images need cropping or resizing first, the image cropper and image resizer prepare them for a clean layout, and the image compressor shrinks the merged file for sharing.
Summary
- Merging joins multiple images onto one canvas, in side-by-side or stacked layouts
- Side by side: width is the sum plus gaps; height matches the tallest image
- Stacked: height is the sum plus gaps; width matches the widest image
- Gaps are adjustable from 0 to 100 px; PNG keeps transparency, JPEG fills it white
- Tools Hub’s image merger does it all from drag & drop — free, in your browser
Start with two screenshots, merge them vertically with a 0 px gap, and see how the pieces line up.
FAQ
How many images can I merge?
Between 2 and 10. They appear in the order you added them, and the thumbnails let you confirm the sequence before merging.
Can I merge images of different sizes?
Yes. Each image keeps its original size; only the layout adapts. Side-by-side layouts align tops, and stacked layouts align left edges, so uneven heights or widths leave some transparent space.
Does merging reduce image quality?
No. The merge copies the original pixels without scaling or recompressing them. Saving as PNG is lossless; saving as JPEG applies compression, so choose PNG when quality matters.
Are my images uploaded anywhere?
No. The merge runs entirely in your browser and images are never uploaded. Documents and personal screenshots are safe to use.
