To combine two images in one image, open the local Combine Images tool in your browser, pick the two files in the order you want them placed, choose a horizontal or vertical layout, set a gap and background color, then download the resulting PNG. The tool runs entirely inside your current tab, so the source files never leave your computer. Each file is decoded at its original pixel dimensions, laid out on a single canvas, painted with the chosen background, and saved as a PNG you can keep, share, or print.
That approach works because Combine Images is built around three explicit constraints: it accepts only browser-decodable raster formats, it draws each image exactly once without scaling or cropping, and it caps the canvas at 8,192 pixels per side. Those rules keep the operation fast and predictable, and they line up with what most people actually want when they search for a quick way to join two photos side by side. The same tool can also handle up to twelve images in a horizontal strip, a vertical stack, or a centered grid, so the workflow you build for two pictures scales cleanly to larger projects without learning a second interface.
What You'll Need Before You Start
Two (or more) source images are the only hard requirement, but a small amount of prep makes the result predictable. Combine Images accepts the raster formats that browsers can decode natively: PNG, JPEG, WebP, GIF, AVIF, and BMP. SVG is deliberately rejected because it can reference external resources or contain very large render instructions that would push the local workflow outside its bounded memory profile. If your source is a vector, run it through an SVG to PNG converter first and use the raster output.
Each file must be 25 MiB or smaller, and the combined selection cannot exceed 100 MiB. The final canvas is also bounded: no side can exceed 8,192 pixels, and the total area cannot exceed 32 million pixels. Those numbers exist to prevent the tab from crashing on large inputs, so if you know your pictures are very high resolution, resize them first or split them with a grid splitter before combining.
Combine Two Images Step by Step
Joining two pictures is a three-stage process: pick the files in order, decide how they should sit on the canvas, then verify the output and download. The steps below walk through the workflow exactly as the tool exposes it.
- Open Combine Images in any modern desktop browser.
- Click the file picker and select the two images you want to join. The order you choose here is the order they will appear in the output, so pick the leftmost (or topmost) image first.
- Pick a layout: Horizontal to place the two images side by side from left to right, Vertical to stack them top to bottom, or Grid if you plan to add more images later.
- Set the gap in pixels (0 to 100) and the background color using the six-digit hex picker. The background fills the canvas behind the images and the strip of space between them.
- Click Combine images. The tool decodes each file in the browser, paints the background, draws each image at its original pixel dimensions, then encodes the canvas as a PNG.
- Read the output dimensions shown by the tool and confirm they match what you expected.
- Click the download button to save the PNG. The downloadable Blob is generated and handed to you through a temporary object URL.
If you only have two pictures and want them joined along their longer edge, the horizontal layout is the default choice. If your images are taller than they are wide, vertical usually reads more naturally. Either way, the order you select is preserved exactly, so reordering before clicking Combine is the easiest way to control the result.
Horizontal, Vertical, or Grid: Picking the Right Layout
The three layouts solve different visual problems, and the differences are documented in how the output canvas is sized. The table below compares the behavior of each option when you are combining exactly two images.
| Layout | Best for | Output canvas | How images are placed |
|---|---|---|---|
| Horizontal | Side-by-side comparisons, before/after frames, panoramic joins | Width equals the sum of every decoded width plus the gaps; height equals the tallest source | Left to right at original pixel sizes; shorter images centered vertically |
| Vertical | Step-by-step sequences, top-to-bottom storytelling, tall compositions | Width equals the widest source; height equals the sum of heights plus the gaps | Top to bottom; narrower images centered horizontally |
| Grid | Three or more images, or two when you plan to add more later | Column count equals the ceiling of the square root of the image count; each cell uses the widest and tallest source as its bounds | Each source centered inside its cell, with no stretching, cropping, or aspect-ratio change |
For a pure two-image task, horizontal and vertical are usually the right picks because they don't leave any cell empty. Grid layout still works — for two images it produces one row with two cells, where the second cell is exactly the height of the tallest source and the width of the widest source. Empty cells, if any, are filled with the background color you chose.
How the Output Canvas Is Calculated
Every pixel in the exported PNG is deterministic, which makes it easy to predict the result before you click Combine. In horizontal mode, the output width is the sum of every decoded image width plus the chosen gap times the number of joints (one joint for two images, two joints for three, and so on). The output height is just the tallest image in the set, and any shorter image is drawn centered vertically against the background.
Vertical mode applies the same rule from top to bottom: width equals the widest image, height equals the sum of heights plus gaps, and narrower images are centered horizontally inside the strip. Grid mode computes a column count by taking the ceiling of the square root of the image count, then makes every cell exactly as wide as the widest source and as tall as the tallest source. Each image is placed in its assigned cell without being resized, cropped, or stretched, and any empty cell space shows the chosen background color.
That deterministic behavior is what makes the workflow repeatable. If the first output is too tall, drop the gap to zero and shorten the vertical list; if it is too short, add the gap back or include another image. The Combine Images page shows the output dimensions before you download, so you can verify the size against whatever you need to upload, embed, or print.
Why a Local Browser Tool Handles This Task Differently
Most online image joiners upload your files to a remote server, process them there, and then send you back the merged result. That model has three practical problems: it exposes private or work-related images to a third party, it depends on the server being online and free, and it usually forces a sign-up or watermark once you go beyond the most basic use. Combine Images skips all three.
Decoding, layout calculation, drawing, PNG encoding, and download generation all happen in the current tab using the browser's own CanvasRenderingContext2D drawImage and HTMLCanvasElement toBlob APIs. The ImageBitmap objects are closed after drawing, and the downloadable Blob is exposed through a revocable object URL. Nothing about your files leaves the machine, which is why the tool can also accept very large inputs as long as they fit inside the published per-file and total-byte limits.
For two images that may include screenshots, ID documents, sketches, or work-in-progress designs, that local model is usually the right default. Cloud editors are still useful when you need cropping, layered retouching, or text overlays — in those cases, use a dedicated editor first and bring the cleaned-up raster files back to Combine Images for the join.
File Limits, Formats, and Things to Watch For
The published limits exist to keep the tab stable, and they interact with each other. If you are below 25 MiB per file and below 100 MiB total, but your canvas would exceed 8,192 pixels on a side or 32 million pixels in area, the tool will still reject the combination. For most two-image tasks at typical phone or screen resolutions, none of those ceilings are reached, but high-resolution panoramas can blow past the per-side limit when stacked horizontally. The safe fix is to resize the inputs first and combine them after, or split one image into tiles with a grid splitter and then recombine.
A few edge cases are worth flagging. Animated GIF, WebP, or AVIF files contribute only the frame that the browser decodes through its image bitmap path; the animation is dropped in the static PNG output. Transparent pixels are also worth thinking about: the background color is painted first, so any transparent area in your source images becomes that opaque color in the export. If you want a transparent output, choose a background only after understanding that the tool always paints the canvas before drawing.
The output PNG preserves sharp pixels and any transparency that survives the background step, but it does not carry EXIF, color profiles, animation, layer information, or the original filenames. For print production or color-managed compositing, verify the exported file in dedicated software before sending it to a printer or a downstream pipeline.
If you're weighing options, How to Use the Blend Image App in Canva (and Beyond) covers this in detail.
If you're weighing options, How to Use Blend Image in Canva and Skip the Upload covers this in detail.