Local Tools

Change language?

Changing language will clear the input on this page, including any selected image and results. Continue?

Image tools

Align two images

Reference A

Screenshot B

Each static JPEG/PNG/WebP: 15MB / 16MP / 8192px · two inputs: 30MB / 32MP

Focus the A or B slot before pasting an image, or drop it into that slot.

Alignment settings

Alignment settings

Scale 1–2000%, DPR 0.25–8, offsets ±8192px. Fit is unavailable beyond this scale range. No automatic CSS/device-pixel inference.

Choose A and B · default 1:1 / B 50%Choose A and B · default 1:1 / B 50%

Choose reference A and screenshot B.

Both images and settings stay on this page. No upload or history.

Help & FAQs

Choose once; switch tools freely.

Choose a reference A and screenshot B. Confirm the mapping, move B and export the actual overlay comparison.

How to align two images

  1. Choose one static JPEG, PNG or WebP for each clearly labeled role.
  2. For different sizes, select 1:1 pixels, fit or explicitly edit geometry. Adjust offsets, equal scale, opacity and declared DPR.
  3. Inspect the bounded preview, generate the real comparison PNG and check it at 100% or 200% before downloading.

Explicit pixel mapping

Oriented reference A pixels define the export canvas. B scale is (A DPR / B DPR) × your percentage. DPR is your declared mapping assumption, not inferred from PNG metadata. Different dimensions require a deliberate 1:1, fit or manual geometry choice. Fit contains and centers B without stretching; exact pixel mode resets both DPR values to 1 and scale to 100%.

A and B are separate file roles; file order never swaps them. Each static JPEG/PNG/WebP is limited to 15MB, 16MP and 8192px per side, together 30MB / 32MP. Image Tabs transfer only reference A; screenshot B belongs to this page and is disposed on exit.

A comparison, not a correctness score

The actual PNG has the oriented dimensions of A and your explicit opaque background. It captures the selected visibility, B opacity and placement without changing source files. Guides are preview-only. This is manual overlay comparison, not automatic design recognition, a pixel-diff percentage or proof that the implementation is correct. Output is limited to 16MP / 8192px / 50MB with 45-second checkpoints; originals decode sequentially, and cancelled or edited tasks cannot restore old downloads.

Common questions

Does the tool find alignment automatically?

No. Choose the coordinate mapping and adjust B explicitly. Arrows move one reference pixel, Shift ten; Home centers B. Escape, blur or pointer cancellation rolls back a gesture.

Is a screenshot pixel necessarily a CSS pixel?

No. DPR describes that relationship only when you know the capture context. The defaults are 1; no device ratio or image metadata is guessed.

Does toggling a guide change my download?

Guides only change the preview. Image visibility, opacity and geometry affect the comparison, so editing them invalidates the old result.