同じ構図・同じ比率の画像ほど比較しやすい
表示枠の中では両画像を object-fit: contain で収めます。構図や縦横比が違う2枚では、境界が同じ位置でも内容が一致しません。
無料Webツール
2枚の画像を重ね、スライダーでBefore / Afterを比較します。
2枚の画像を同じ枠に重ね、境界スライダーを左右へ動かしてBefore / Afterを見比べます。加工前後やデザイン修正前後を目視確認するためのツールです。
これは目視比較用です。ピクセル差を数値化するツールではありません。数値・差分画像が必要なら「画像差分ヒートマップ」を使ってください。
表示枠の中では両画像を object-fit: contain で収めます。構図や縦横比が違う2枚では、境界が同じ位置でも内容が一致しません。
A画像を全面表示し、その上にB画像を重ねて、Bの表示幅だけを0〜100%で変えます。画像そのものを合成・編集しているわけではありません。
比較表示の下にA/Bそれぞれのファイル名とファイルサイズを表示します。見た目だけでなく、圧縮前後の容量確認にも使えます。
このツールの役割はブラウザ上での見比べです。境界線入りの比較画像を書き出す機能はありません。