ガイド · ピクセル

ブラウザで写真を指定ピクセルにリサイズする

フォームが長辺 1280 px、または 600×400 を指定しました。そのピクセルをタブで設定し、実測バイト数を読んでダウンロードします。これはキロバイト上限ではありません。

スマホの写真は 4032×3024 前後が多いです。CMS やフォームはファイルサイズではなくピクセルサイズを指定することがあります。LocalPix の リサイズ はこのタブで再サンプルします。写真はアップロードされません。状態行は出力の幅・高さと、エンコード後の実際の blob.size を出します。

関連する作業: フォームが 100 / 200 / 500 KB と書いたなら 添付のKB上限、JPEG も必要なら PNG→JPG、ポータルが独自の数字を印刷しているなら 役所フォームのJPG容量、次が小さな顔写真なら 履歴書の写真。

手順

  1. リサイズ を開きます。ファイルを選ぶまでボタンは無効です。任意の確認: ローカル検証。
  2. ディスクから JPEG、PNG、WebP、HEIC、AVIF をドロップします。80 MiB(83,886,080 バイト)超は拒否されます。ファイル選択では libheif は始まりません。
  3. フォームが書いた幅と高さを入力するか、「長辺」に切り替えて数字を1つ(例: 1280)入れます。縦横比の維持はオンなので、4:3 の写真に 1280 と入れると 1280×960 になります。「リサイズ」を押します。
  4. 状態行で入力ピクセル、出力ピクセル、実測 KB を読みます。ローカルの blob: URL から -{width}x{height} をダウンロードします。フォームが KB 上限も書いていれば、その JPEG を次に KB指定で圧縮 へ。

仕組み

JPEG / PNG / WebP はこのブラウザでデコードし、canvas.drawImage が新しい格子を書きます。PNG は PNG のままです。JPEG、WebP、HEIC、AVIF は品質 0.92 の JPEG になります。HEIC は「リサイズ」押下時に /assets/libheif/ から libheif-js 1.23.5(1,463,506 バイト)を読み、HEIC→JPG と同じデコーダです。

バイトサイズはこのページの目標ではありません。1280 px の JPEG は写真によって 80 KB にも 400 KB にもなります。状態行は blob.size そのものです。名前の付いたキロバイト上限は KB指定で圧縮 で、そちらは幅も高さも変えません。

制限

よくある質問

写真はこの端末から出ますか?

いいえ。処理はタブ内です。ネットワークでは HEIC のとき /assets/libheif/ の libheif が見えることがあります。写真の POST は見えてはいけません。ローカル検証。

フォームは 1280 px ではなく 100 KB と書いていました。

それはファイルサイズの作業です。KB指定で圧縮 を開いて 100 と入力します。リサイズはその数字へ向けた JPEG 品質探索をしません。

4000 px の写真に 640 と入れると 100 KB になりますか?

保証はありません。640 px は多くの場合より小さいファイルになり、状態行は実測バイトを出します。まだ上限が必要なら、その JPEG を次に圧縮します。