Uwarp

Add two images to merge them.

  • Image 1 — not added yet
  • Image 2 — not added yet
Border thickness (px)

Help Us Improve

—

(—)

Merge two images online

Merge two photos horizontally or vertically into one image. Border option, preview, PNG download.

What is merge two images?

Merge two images combines a first and second photo into one file—whether you need to combine images online, put two pictures side by side, or stack them vertically. Choose horizontal or vertical layout, optionally scale or crop so widths or heights align, and add a colored border between panels. It stitches panels edge to edge; it does not overlay layers. Upload both images, adjust options, preview, and download PNG—all processing runs in your browser.

Merge controls

Merge two images or combine two photos online—vertical stack, side by side, size matching, optional border, PNG download.

  1. Merge two images into one PNG: Put two images together—stack vertically or join horizontally with an optional colored gap between panels.

  2. Combine images online: Upload a first and second file without install—preview the stitched result, then download PNG.

  3. Four size modes: Do not adjust, magnify smallest, reduce biggest, or crop biggest so widths or heights align.

  4. Side by side photos: Horizontal layout for comparison shots; match heights with size modes and add a colored gap.

  5. Border thickness and color: Gap between images from 0 to 100 px with hex color for the fill.

  6. PNG download: Save the merged result as merge-images.png.

How to combine two photos online

Merge two pictures vertically or side by side—before/after, comparison, or simple collages.

  1. Upload both images

    Add a first and second file (15 MB max each).

  2. Choose layout

    Pick vertical stack or horizontal row for side-by-side photos.

  3. Match sizes

    Use magnify smallest for most collages; crop biggest to avoid scaling.

  4. Download PNG

    Save when the preview looks correct.

Tips for merging images

Cleaner results when you combine two photos.
  • 01

    Start with magnify smallest

    Usually the best default when image sizes differ.

  • 02

    Use crop for screenshots

    Crop biggest avoids soft scaling on sharp UI captures.

  • 03

    Horizontal for comparisons

    Side-by-side layout works well for before/after width.

  • 04

    White borders for print

    A few pixels of white separate panels cleanly.

  • 05

    Check output size

    Very large merges may hit the 8192 px output limit.

  • 06

    PNG for transparency

    Use PNG uploads when either layer needs alpha.

  • 07

    Layouts vs true layering

    Merge Images lays panels edge to edge. If you need one image placed on top of another with position, scale, rotation, and opacity, use Overlay Images.

Image Merge Tools Compared — Which One Fits Your Workflow

How this free image merge tool stacks up against other popular options.

  1. PineTools.com

    Merge images horizontally or vertically. Simple alignment modes. Requires Apply button.

  2. Imagy.app

    Merge images with positioning, gap, and border options. Batch processing available. More configuration needed.

  3. PhotoFunny.com

    Photo combiner with fun layouts. Less suited for serious image merging.

  4. OnlineConvert.com

    Basic image merging with format selection. Server upload required.

  5. Merge Images

    Merge two images horizontally or vertically with adjustable alignment, gap size, and border. Color picker for gap fill. Real-time preview.

When to merge two images

Typical uses for combining photos online.

  • Before and after

    Stack or place edits side by side for social proof.

  • Comparison shots

    Line up two product or design variants horizontally.

  • Side by side photos

    Join two pictures in one frame for posts or slides.

  • Tutorials

    Combine step screenshots into one tall reference image.

  • Simple collages

    Merge two photos with a white or brand-colored border.

  • Quick mockups

    Put two images together before importing into Figma or decks.

Why use this merge tool

Benefits of browser-based two-image combine.

  • Two uploads

    Dedicated panels for first and second images.

  • Private

    Images stay on your device—no server upload.

  • Live preview

    See layout and border changes before download.

  • Flexible sizing

    Four alignment modes like classic online merge tools.

  • No install

    Works in any modern browser with Canvas 2D.

  • Free

    Unlimited previews and downloads.

Technical details

How two-image merge works here.
Canvas compositing
Each layer drawn with optional source crop and destination scale.
Cross-axis matching
Width matched for vertical merges; height matched for horizontal.
Center alignment
Images centered on the axis perpendicular to the merge direction.
Border fill
Full canvas filled with border color; gap thickness between panels.
Input limits
15 MB per upload; 8192 px max edge per image and merged output.
Browser support
Chromium, Firefox, Safari with Canvas 2D.

Sources & References

Authoritative references on image compositing techniques, the Canvas rendering technology this tool uses, and the PNG output format.
  • “Compositing is the combining of visual elements from separate sources into single images, often to create the illusion that all those elements are parts of the same scene.”
    — Wikipedia — Image compositing

    Image compositing fundamentals: This tool composites two images edge-to-edge into a single PNG, applying the core compositing concept of combining separate visual elements — whether side-by-side or stacked vertically. en.wikipedia.org/wiki/Compositing

  • “The Canvas API provides a means for drawing graphics via JavaScript and the HTML canvas element.”
    — MDN Web Docs — Canvas API

    Canvas API (client-side compositing): This tool uses Canvas 2D drawImage operations to composite two source images onto a single output canvas with precise positioning, scaling, and border fills — all locally in your browser. developer.mozilla.org/en-US/docs/Web/API/Canvas_API

  • “PNG supports lossless data compression, making it useful for storing graphics that need to be edited repeatedly without losing quality.”
    — W3C — PNG Specification (overview)

    PNG image format: Downloading the merged result as PNG preserves the full quality of both source images and any transparency. PNG's lossless compression is ideal for edge-to-edge composites. w3.org/TR/PNG/

  • “Photomontage is the process and the result of making a composite photograph by cutting, gluing, rearranging and overlapping two or more photographs into a new image.”
    — Wikipedia — Photomontage

    Photomontage techniques: Image merging combines multiple source images into a single composite — this tool overlays or stacks photos, with options for alignment and blend mode control. en.wikipedia.org/wiki/Photomontage

Frequently Asked Questions

Quick answers about this tool—open a question to read more.