← ちょっとした診断LAB

SCREENSHOT COMPARE

ちょっとしたスクショ比較

変更前と変更後を重ね、位置を合わせながら違う場所を確認します。

スクリーンショット比較ツール

IMAGES

比較する2枚

JPEG / PNG / WebP。枠を選んでから画像を貼り付けることもできます。

変更前 基準にする画像

ここへドロップ、貼り付け、または選択

未選択

変更後 重ねて確認する画像

ここへドロップ、貼り付け、または選択

未選択

貼り付け先: 変更前

COMPARE

比較画面

表示

2枚の画像を追加すると、ここで比較できます。

比較領域-
表示全体

画像を2枚追加してください。

ADJUST & SAVE

比較と位置合わせ

比較モード

変更後画像の位置

「変更後」の画像を動かします。 Xは左右、Yは上下です。プラスで右・下、マイナスで左・上へ移動します。拡大率も「変更後」の画像だけに適用されます。

上揃え
変更前と変更後の上端を揃え、左右中央へ配置します。
中央揃え
変更前と変更後の中心を揃えます。
位置を戻す
X・Yを0、拡大率を100%へ戻します。

スライドモードでは、中央の境界上をドラッグすると境界を移動し、それ以外の画像部分をドラッグすると変更後画像を移動します。

PCでは矢印キーで1px、Shift+矢印キーで10pxずつ移動できます。

保存

「表示中の比較をPNG保存」は、現在画面に見えている比較結果を保存します。スライドは境界位置、重ねるは透明度、違いは赤い強調表示が反映されます。点滅では、押した瞬間に表示されている1枚を保存します。

「違う部分を赤くしてPNG保存」は、比較モードに関係なく、違うと判定された画素を赤くした画像を保存します。「しきい値」の設定が反映されます。

「違い」モードを表示中は、2つの保存結果が同じになることがあります。

操作ボタンや境界ハンドルは保存画像へ入りません。

変更前と変更後の画像を追加してください。

GUIDE

操作方法

画像を入れる

「変更前」と「変更後」に画像を選ぶか、ドラッグ&ドロップします。

貼り付ける場合は、先に対象の画像枠を選び、枠内に「貼り付け先」と表示されたことを確認してからCtrl+Vまたは貼り付け操作を行います。

比較方法

スライド
中央の境界を左右へ動かして見比べます。
重ねる
変更後画像を重ね、透明度を変えてずれを確認します。
点滅
変更前と変更後を交互に表示します。
違い
異なると判定された部分を赤く表示します。

しきい値

小さくすると細かな色の違いまで拾います。大きくすると圧縮ノイズなどの小さな違いを無視します。

「違う画素」は違いの割合と数、「違う範囲」は違いが見つかった範囲です。

表示サイズ

全体
画像全体が収まる大きさで表示します。
横幅
横幅を合わせ、長い画像は縦にスクロールして確認します。
100%
元画像のピクセル寸法で表示し、必要に応じて縦横へスクロールします。

位置調整

変更前画像を基準に、変更後画像のX・Y・拡大率を調整します。

スライドでは境界上をドラッグすると境界が動き、それ以外の画像部分をドラッグすると変更後画像が動きます。

保存

「表示中の比較をPNG保存」は、その時点で画面に見えている比較結果を保存します。

「違う部分を赤くしてPNG保存」は、比較モードに関係なく、しきい値に基づく赤い違い画像を保存します。「違い」モードでは2つの保存結果が同じになることがあります。

SPONSORED

ABOUT

このツールについて

Webページ修正前後、資料や写真の変更、撮り直した画面を見比べるための簡易ツールです。画像はこのツールの比較処理のために送信せず、ブラウザ内で扱います。

色管理や撮影条件が異なる画像の厳密な検査を保証するものではありません。違いの割合と範囲は、現在の位置合わせとしきい値を基準にした目安です。

利用者コメント

0件のコメント

まだコメントはありません。

コメントする