ToolRoll
必要な道具を、すぐ広げる。ITミニツール集。

画像トリミング｜画像を切り抜き・保存

画像ツール

JPEG・PNG・WebP、20MB以下の画像を1枚選択してください。

px
px
px
px

JPEG、PNG、WebP画像を選択してください。

このツールでできること

JPEG、PNG、WebP画像を1枚選び、必要な矩形範囲だけを、その範囲と同じピクセル寸法の新しい画像として保存できます。自由な範囲のほか、元画像、1:1、4:3、3:2、16:9のアスペクト比を指定できます。画像を選んだ直後の範囲は画像全体です。

使い方

  1. JPEG、PNG、WebP画像を1枚選択します。
  2. 必要に応じてアスペクト比を選択します。
  3. 枠の内側や四隅をドラッグするか、左位置X、上位置Y、幅、高さを入力して範囲を調整します。枠を選択した状態では、矢印キーで1ピクセル、Shiftキーと矢印キーで10ピクセル移動できます。
  4. 「画像をトリミング」を押します。
  5. プレビューと出力情報を確認し、「画像を保存」を押します。

入力例・出力例

1600×900pxの画像で、左位置Xを400、上位置Yを50、幅を800、高さを800にすると、左から400ピクセル、上から50ピクセルの位置を起点とする範囲を800×800pxの画像として保存します。

同じ1600×900pxの画像全体を選択した状態でアスペクト比を1:1にすると、中央の900×900pxへ調整され、左位置Xは350、上位置Yは0になります。出力寸法は選択範囲そのもので、切り抜き時の拡大・縮小や余白追加は行いません。

よくある利用場面

  • 写真から必要な人物・商品・画面部分だけを切り出すとき
  • 正方形や16:9等の比率でSNS・バナー用画像を作るとき
  • 画像を拡大・縮小せず、不要な周囲だけを取り除くとき

トリミング範囲と画像の再生成

左位置Xは画像左端から、上位置Yは画像上端から数え、左上端をX=0、Y=0とします。XとYは0以上、幅と高さは1以上の半角数字による整数で指定し、X + 幅とY + 高さが画像の範囲内に収まる必要があります。ドラッグで生じた座標と寸法は最も近い整数へ丸め、枠の移動や自由比率のリサイズは画像境界内へ制限します。

固定比率を選ぶと、現在の範囲を基準に画像内へ収まる寸法を求め、できるだけ中央へ配置します。四隅のドラッグでは反対側の角を固定し、比率を保ったまま境界内へ制限します。数値入力では幅を変えると高さ、高さを変えると幅を比率から四捨五入して求めます。ピクセルは整数のため、小さい範囲では指定比率とわずかに異なる場合があります。範囲または比率を変えると以前の出力は破棄され、もう一度「画像をトリミング」を押す必要があります。

切り抜きはブラウザのCanvasへ選択範囲を同じ幅と高さで描き、新しい画像ファイルとして再生成します。JPEGとWebPには品質ヒント0.92を渡し、PNGには品質値を指定しません。この値はファイル容量の割合ではなく、実際の圧縮方法、画質、色、容量はブラウザの画像エンコーダーによって異なります。切り抜いても、元画像の圧縮状態や内容によってはファイル容量が小さくなるとは限りません。PNGとWebPの透明度はブラウザの対応範囲で維持し、JPEGの描画面は白で初期化します。

Canvasで再生成するため、EXIF、GPS位置情報、撮影日時、DPI、ICCカラープロファイル等のメタデータ保持や元画像との完全な色一致は保証しません。EXIF Orientationを独自には解析せず、表示、座標、出力方向はブラウザがデコードした画像に基づくため、保存前にプレビューを確認してください。

処理仕様

入力ファイルは20 × 1024 × 1024バイト以下です。画面上の「20MB」は実装上20MiB、20,971,520バイトを表します。元画像は幅・高さ各12,000ピクセル以下かつ40,000,000ピクセル以下です。上限内でも、大きな画像は端末のメモリやブラウザの制限により処理できない場合があります。

形式はファイル名やMIMEタイプだけでなく、ファイル先頭のシグネチャから判定します。MIMEタイプが空、または拡張子・MIMEタイプと実データが異なる場合も、実データがJPEG、PNG、WebPで画像としてデコードできれば、その実データの形式で処理・保存します。出力は1ピクセル以上、元画像の範囲内かつ32,000,000ピクセル以下です。8,000×4,000pxは上限内ですが、8,000×4,001pxは上限を超えます。ブラウザが元と同じ形式で書き出せなかった場合はエラーになります。

保存名は元ファイル名から制御文字やファイル名に使いにくい記号を除き、photo-cropped-800x800.jpgのように出力寸法と実データの形式に対応する拡張子を付けます。アニメーションは保持しないため、アニメーションWebPも対象外です。

入力データについて

選択したファイルの名前、容量、ブラウザがデコードした寸法と画素、トリミング後の画像はブラウザ内だけで処理され、ToolRollのサーバーや外部サービスへ送信されません。外部API、外部ライブラリ、Cookie、localStorage、sessionStorage、IndexedDB、ブラウザの履歴は使用しません。「画像を保存」を押したときだけブラウザのダウンロード機能へ生成画像を渡します。