画面サイズの画像比較

画像レイアウトの比較方法

1. 静止JPEG、PNG、WebPを1枚選択・ドロップ・貼り付けします。
2. 画面幅と固定高さまたは縦横比を選びます。両方の枠に同じ余白・位置・背景を適用します。
3. 元画像の表示範囲と保持率を確認し、実際のPNGを生成してレイアウト条件を共有します。

画素数・ファイル容量・レイアウトは別の値

800×400画像の元の比率は2:1ですが、ページでは390×240 CSS画素の枠に入る場合があります。containは全体と余白を表示し、coverは枠を満たして両端を切り抜きます。KBは符号化されたバイト数であり、KBを減らすだけではCSSレイアウトは変わりません。

画面幅は明示したCSSビューポートの条件であり、特定の機種、DPR、物理サイズや完全なブラウザーエミュレーターではありません。表示倍率は作業領域へのフィット用に別記します。余白率は描画画像の外側を数え、元画像内の透明画素は含みません。小数の元画像座標は幾何学的なサンプリング範囲で、整数画素の切り抜き操作ではありません。

条件を明示したローカル比較

静止JPEG／PNG／WebPを1枚、15MB・16MP・辺8192pxまで。画面幅200–1440 CSS px、枠高32–4096。比率の各項は1–8192の整数で、計算した高さを最も近い整数に丸めます。左右余白は各0–96で枠幅32px以上、位置は0–100%です。

PNGには2列のレイアウト、固定ラベル、数値の幾何と明示した不透明背景を含めます。1 CSS画素を出力1画素に対応させ、入力名やメタデータをコピーしません。出力は16MP・辺8192px・50MB以内、45秒のチェックポイント付きです。画像モードはアップロード・遠隔画像の取得・画像の永続保存を行いません。

ウェブサイト

読み込むとブラウザがサイトに接続します。Cookieの送信や他のリソースの取得が起こり得ます。URLはこのページ内に留まり、分析には含めません。

埋め込みを禁止するサイトもあります。制限付き表示ではログイン、フォーム送信、ポップアップ、ページの画像出力はできません。表示領域の変更であり、ブラウザや端末機能の模倣ではありません。

端末のサイズでレスポンシブ表示を確認。倍率は作業画面上の表示だけを変えます。

よくある質問