かんたんWebツール

登録不要・無料で使える便利ツール

無料ツール

画像差分チェッカー

2枚の画像を重ね合わせ、ピクセル単位の違いを見つけます。

Loading tool…

画像差分チェッカーについて

比較元と比較先の画像を重ね合わせ、ピクセル単位の違いを赤色で可視化します。画像はサーバーへアップロードされず、すべてブラウザ内で処理されます。

使い方

  1. 1.比較元と比較先の画像を1枚ずつ選択します。
  2. 2.必要に応じて許容誤差を調整し、画像を比較します。
  3. 3.差分率と赤色の差分画像を確認し、必要ならPNGで保存します。

こんなときに便利

  • Webページのスクリーンショット比較
  • デザイン修正前後の確認
  • 画像書き出し結果の品質チェック

検証した例と対応範囲

このツールで再現できる挙動を、入力と期待結果で示します。記載した対応範囲外の入力に対する保証ではありません。

入力・設定期待結果条件・補足
同じ1×1 RGBA画像2枚、許容誤差0変更ピクセル0、差分率0%全RGBA channelが同一の場合です。
1×1画像で赤channelだけ17異なる、許容誤差16変更ピクセル1、差分率100%4 channelの最大絶対差が許容誤差を超えると変更扱いです。

対応範囲・既知の制限

  • 入力は各10MiB・4MP以下のJPEG・PNG・WebPです。
  • 寸法が異なる場合は大きい方へ引き伸ばすか、左上へ原寸配置するため、元画像同士の一対一比較とは異なります。

期待した結果にならない場合

  • 意図しない差分が多い場合は、同じ寸法・形式の画像を使い、許容誤差と寸法の合わせ方を確認してください。

処理方法

各ピクセルのRGBA 4 channelで最大絶対差を求め、0〜255の許容誤差を超えたピクセルを変更として数えます。

2枚の画像、ファイル名、差分データはブラウザ内で処理します。

入力例

  • 修正前後のWebページのスクリーンショット
  • 書き出し設定が異なる2枚の画像

注意事項・制限

  • 正確なピクセル比較には、同じ寸法の画像を使用してください。
  • JPEG圧縮やアンチエイリアスによる微差は許容誤差で調整できます。

よくある質問

画像はサーバーへアップロードされますか?

いいえ。画像の読み込み、比較、差分画像の生成はすべてブラウザ内で行われます。

画像サイズが違っても比較できますか?

はい。大きい方のサイズに合わせて表示寸法を揃えて比較します。正確なピクセル比較には同じサイズの画像がおすすめです。

許容誤差とは何ですか?

色の小さな違いを差分として扱わないための値です。値を上げるほど微細な色差を無視します。