このページのコードが起動しませんでした。

index.htmlをフォルダから直接開くと、ブラウザがJavaScriptモジュールを読み込めません。そのため画像を選んでも何も起きません。フォルダはhttpで配信してください。

powershell -ExecutionPolicy Bypass -File serve.ps1

そのうえでhttp://localhost:8080/を開いてください。

画像リサイズ|サイズ変更・切り抜き・形式変換

サイズを指定し、枠を描き、形式を選ぶ。それだけです。

言語: 日本語
ソースを見る
画像はブラウザー内で処理されます。処理のためのアップロードはありません。

リサイズも切り抜きも形式変換も、お使いのブラウザと手元のハードウェアが、最初から入っている画像エンコーダーを使って行います。このツールにはネットワーク機能が一切ありません。取りに行く先も、送る先もありません。仮に送ろうとしても、このページの向こう側に画像を受け取るサーバーが存在しません。

いまの通信: 確認中…

オフライン: 確認中…

鵜呑みにする必要はありません。DevToolsの「ネットワーク」タブを開いたまま写真をリサイズしてみてください。画像もサムネイルもファイル名も、選んだファイルの1バイトも、どのリクエストにも載りません。回線を抜いてからリサイズしてみるのでも構いません。

1 画像を選ぶ

2 必要なら切り抜く

枠は画像全体に置かれた状態で始まるので、この段階に触れなければ何も切り取られません。画像はそれぞれ自分の枠を持っているので、上のリストから選べば、その画像の上に描けます。切り抜きはリサイズより先です。意味の通る順序はそれだけしかありません。縮めたあとで切り落とされた画像は、必要だったピクセルをすでに捨ててしまっているからです。

枠の内側をドラッグすれば移動、四隅をドラッグすれば大きさが変わります。枠を選んだ状態なら、矢印キーで1ピクセルずつ動かせます。Alt + 矢印で大きさが変わり、Shiftを押しながらなら1回10ピクセルです。

画像を追加すると、ここに枠が出ます。

3 どの大きさにするかを決める

元より大きくしない 拡大とは、そもそも写っていなかったピクセルを発明することです。ですから小さな画像を大きな枠に入れると、細部が増えるのではなく、ぼやけて出てきます。これを入れておけば、指定した大きさよりすでに小さいものは、自分の大きさのまま残ります。

一方だけ埋めてもう一方を空にしておくと、画像は自分の縦横比を保ちます。

4 保存する

画質(85) JPEGとWebPだけに効きます。PNGに画質のつまみはありません。85は、たいていの人が見分けられなくなるあたりです。60を下回ると、平坦な部分に段が出始めます。

背景 画像のないところに出る色です。余白で埋めた枠の周り、そして書き出し形式にアルファチャンネルがない場合の透過部分の後ろに出ます。

ダウンロード

Markdownで表示

画像をアップロードせずにリサイズする手順

  1. 画像を選びます。選択欄にドロップするか、手で選んでください。ブラウザがディスクから直接読み出します。その間に何かがどこかへ送られることはありません。
  2. 必要なら切り抜きます。枠は画像全体に置かれた状態で始まるので、触らなければ何も切り取られません。ドラッグするか、形を固定してください。プロフィール画像なら1:1、ストーリーズなら9:16、サムネイルなら16:9です。「最大」を押せば、その形で収まるいちばん大きな枠になります。画像はそれぞれ自分の枠を持っているので、リストの行をクリックすれば、その画像の上に描けます。全部を同じ構図にしたいなら、それもボタンひとつです。
  3. どの大きさで出すかを指定します。幅、高さ、あるいはその両方。縦位置と横位置の写真を互いに同じ大きさへ揃える長辺指定。あるいは単純なパーセント指定です。2つの欄の一方を空にしておけば、画像は自分の縦横比を保ちます。
  4. 形式を選んで、ボタンを押します。それぞれのファイルが届いたときの形式を保つか、すべてをJPEG、PNG、WebPのいずれかで書き出すかです。各結果には、何になったか、どれだけ小さくなったかが表示されます。クリックすると原寸で開き、裏にあるすべての数値と、比較用の元画像が並びます。まとめて処理した場合は、1つのzipにまとまって届きます。

詳しい解説

画像を台無しにせずにリサイズする方法 サイズ変更で起こること。縮小時の細部の損失、拡大時の補間、縦横比が違う枠への調整、切り抜くタイミングを説明します。

よくある質問

画像はどこかにアップロードされますか?

されません。読み込みも切り抜きも拡大縮小も書き出しも、お使いのブラウザが手元のハードウェア上で、最初から入っているJPEG・PNG・WebPのエンコーダーを使って行います。このツールにはネットワーク機能が一切なく、何も取りに行かず、何も送りません。ページのContent-Security-Policyには接続してよいアドレスがすべて挙がっていますが、そのどれも当サイトのものではありません。

幅だけ指定して高さを指定しないとどうなりますか?

高さは画像自身の縦横比から決まります。ほとんどの場合、それが求められているものです。「幅1920」は「幅1920、高さはそれに応じた値」という意味だからです。両方を埋めると、その2つが画像の縦横比と食い違うことがあります。「縦横比が食い違う場合」の選択肢が現れるのは、そのときだけです。枠の内側に収める、いっぱいに広げてはみ出しを切る、背景で余白を埋める、引き伸ばして歪みを受け入れる、のいずれかです。

リサイズすると画質は落ちますか?

縮小すると画素が減り、小さな文字や細線、細部が失われることがあります。写真が使用サイズできれいに見えても同じです。拡大しても記録されていない細部は戻りません。JPEGや非可逆WebPのエンコードはさらに劣化を加える場合があります。PNGは縮小後の画素を保持し、元の細部は復元しません。実際に使うサイズで確認してください。

画像ごとに違う切り抜きができますか?

できますし、それが既定です。リスト上のどの画像も、自分のピクセルで自分の枠を持っており、行をクリックすればその画像がプレビューに入り、その枠と固定した形がそのまま戻ってきます。ある1枚に対する操作が、ほかに影響することはありません。どの枠も画像全体に置かれた状態で始まるので、一度も描かなかった画像はまったく切り抜かれません。

まとめて同じ切り抜きをかけられますか?

できます。プレビューの下のボタンです。ほかのすべての画像に、同じ相対的な範囲、つまりそれぞれの幅と高さに対する同じ割合を与えます。すべて同じ大きさのスクリーンショットや書き出しの集まりなら、それはまったく同じ枠になり、ページもそう表示します。形を固定している場合は、その範囲の中でその形の最大の枠を各画像に与えます。ですから1:1を押してからこのボタンを押せば、縦位置と横位置の混ざったフォルダから正方形が取れます。どの枠も、あとから編集できます。

読み書きできる形式は何ですか?

読み込めるのはブラウザがデコードできるものすべてで、実際にはJPEG、PNG、WebP、GIF、BMP、そして最近のたいていのブラウザではAVIFです。書き出しはJPEG、PNG、WebPで、ブラウザが備えているエンコーダーがそれだからです。「形式を保つ」ではJPEGはJPEGのまま、PNGはPNGのままです。GIFやBMPのようにブラウザが書き出せないものはPNGになります。透過と平坦な色をそのまま保てるのがPNGだからです。

JPEGで保存すると透過はどうなりますか?

背景色で埋まります。JPEGには透過を保存するアルファチャンネルがないからです。色は自分で選べ、初期値は白です。多くの方が求めるのがそれであり、ほかのほとんどの道具が何も言わずにそうしているものでもあります。同じ色は、余白を埋めるときにも使います。PNGかWebPで保存すれば、透過はそのまま通ります。

EXIFやGPSの情報は消えますか?

実際に処理したものについては、副作用として消えます。切り抜きやリサイズとは画像をピクセルに戻し、そのピクセルを書き直すことで、ピクセルで埋まったキャンバスはタグを持ちません。ですから位置情報もカメラの機種も撮影日時も、新しいファイルには書き込まれません。まったく変更していないファイルは別で、タグごと1バイトも変えずに返ります。EXIFビューアー・削除ツールはJPEG、PNG、WebPの画像を再エンコードせずにメタデータを閲覧・編集します。AVIFは抽出できたEXIFの読み取り専用表示に対応し、最初にデコードした画像を新しいPNGへ変換して削除します。色やHDRが変わる場合があります。

画像圧縮ツールとはどう違いますか?

こちらは寸法の話です。何ピクセルほしいかを指定すれば、そのとおりに返します。画像圧縮ツールはファイルサイズの話です。何キロバイトまで許されているかを指定すれば、そこに収まる中でいちばん高い画質を探し、画質だけでは届かないときにだけ縮小します。「幅1200ピクセルで」と言われたならこちらが正解です。「500KB以内で」と言われたなら、あちらのほうが近づけます。

無料ですか。アカウントは必要ですか?

無料です。アカウントも、ログインも、試用期間も、透かしもありません。ファイルの数にもサイズにも制限はありません。その費用を払うサーバーが存在せず、処理が手元の端末で起きているからです。このサイトには広告があり、それが費用を賄っています。広告に画像の情報が渡されることはありません。

オフラインでも動きますか?

動きます。ページを一度読み込んでから通信を切っても、そのまま使えます。何もアップロードされていないことを示す、いちばん簡単な方法でもあります。リサイズのために画像をどこかへ送っている道具なら、線を抜いた瞬間に止まるからです。