How to Stitch Screenshots Into One Long Image

A scrolling page, a chat transcript, a before-and-after comparison — several jobs end with "I need these images as one file". Image Stitching does that in the browser, and its few controls hide more than they look like they do.

Two images minimum, any decodable format

The tool refuses to run with fewer than two images. One image is not a stitch — resize or convert it instead.

Input accepts anything your browser can decode (JPG, PNG, WebP, BMP, GIF), with non-image files dropped silently. Whatever the input mix, output is PNG or JPG only. Animated GIFs contribute a single frame, like any other canvas-based re-encode.

Direction decides which dimension is shared

• Vertical — images stack top to bottom. The shared dimension is width; each image keeps its own aspect ratio and therefore gets its own height.
• Horizontal — images sit side by side. The shared dimension is height; widths vary.

That asymmetry explains the most common surprise. If you stack three screenshots of different widths in vertical mode, they do not "look joined" — they are all forced to one width, so the narrow ones come out smaller in absolute terms and their text shrinks with them. Matching sources is the fix: same device, same browser window, same zoom.

Reference base: first, smallest, or largest

The reference base picks which image's dimension becomes the shared one:

• First — the top image in the list wins. Predictable, and the natural choice when the set is already uniform.
• Smallest — everything shrinks to match the smallest. The most faithful option, because nothing is enlarged, but the result is limited by your narrowest input.
• Largest — every image is scaled up to the biggest one's fixed dimension. Upscaling invents no detail, so text in the smaller images softens. Use it only when the images are near-identical in size and you want the largest common output.

Scale then shrinks the reference from 10% to 100%. It cannot enlarge beyond the reference — the ceiling is 100%, so this control only ever reduces. If your goal is a bigger file, change the reference base instead.

Order matters and is editable: drag list items to reorder, and the composite re-renders.

Spacing and background

Spacing (0–50 px) is inserted between images — n images produce n−1 gaps, so the outer edges never gain padding. Set 0 for a seamless long screenshot; 10–20 px reads well for comparisons.

The background colour and its opacity control what fills those gaps:

• PNG with opacity above 0 — gaps and any transparent areas take the matte colour you chose.
• PNG with opacity 0 — no background is painted at all, so gaps are genuinely transparent and alpha inside each image is preserved. This is the only route to a transparent composite.
• JPG — transparency is impossible, so selecting JPG forces opacity back to 100% and updates the slider to match. The matte colour then fills every gap.

For JPG output the encoder quality is fixed at 0.92 with no control exposed. PNG is lossless and the safer default for screenshots containing text; switch to JPG when the composite is photographic and size matters — see how to compress an image for what to expect from that.

The two canvas ceilings

Browsers cap canvas dimensions, and the tool checks against them before drawing:

• No side longer than 65,535 pixels.
• Total area no greater than 160,000,000 pixels.

Cross either one and you get a warning naming the limit and the current dimensions, and no new composite is produced. This is what stops very long full-page captures: 12 slices at 1440 × 900 already reach roughly 15.7 million pixels of height, and 4K inputs multiply fast.

If you hit it, in order of effectiveness: lower Scale, choose Smallest as the reference base, split the set into two composites, or drop images whose content overlaps.

One caution when a warning appears: the previous composite stays on screen and remains downloadable. If you were mid-way through changing parameters, check the preview actually reflects what you wanted before you download — the filename is always stitched.png or stitched.jpg, with nothing in it to tell the two apart.

Preview versus download

The preview is downscaled to fit the panel, over a checkerboard so transparency is visible. The downloaded file is full size. To judge legibility, open the download and zoom to 100% — the preview is for composition, not for sharpness. Alongside it the tool reports total width, total height, image count and output file size, which is the quickest way to sanity-check a long capture before opening it.

When stitching is the wrong approach

• Overlapping content. There is no blend or dedup step; overlap appears twice.
• Different scales. Logos jump in size at each seam.
• Very long pages. The canvas ceilings make full-page capture a poor fit — take segmented screenshots, or a PDF instead.
• Precise layout. Gaps, alignment and cropping are fixed by the shared-dimension rule, not by you. A drawing program gives control this tool deliberately does not have.

Privacy

Images are read and composited inside the tab. Nothing is uploaded, no account is needed, and the output is a local blob you download directly. The page loads analytics and advertising scripts like the rest of the site, but your image data does not travel.

Related guides

• How to convert an image to PNG, JPEG, or WebP — re-encoding the composite afterwards
• How to compress an image without making it worse — long PNGs are heavy; width and quality first
• Batch resize and convert images: what to know first — uniform output across many separate files