画像を指定アスペクト比でトリミング
画像を正確なアスペクト比に切り抜く処理は単純に見えますが、計算を誤りやすい作業です。このツールでは元画像の幅と高さ、および 16:9 などの目標比率を入力すると、その画像内に収まる同じ比率の最大長方形を返します。範囲は中央に配置されるため、向かい合う辺から同じ量が取り除かれます。画像のアップロードや変換は行いません。エディター、スクリプト、画像処理パイプライン、レスポンシブレイアウトで再利用できる座標だけを取得できます。
無料で実行
寸法と比率からトリミング長方形を求めます
画像の幅と高さをピクセル単位で入力し、目標比率を幅対高さの形式で指定します。2つの値はコロンで区切ってください。代表例は、正方形のサムネイル向けの 1:1、一般的な写真向けの 4:3、ワイド画面向けの 16:9、縦型ストーリー向けの 9:16 です。計算では元画像と指定値を比較し、すでに適合している方向を判断します。元画像が横に広すぎる場合は高さをすべて残して幅を縮め、縦に高すぎる場合は幅をすべて残して高さを縮めます。x と y は左上角の位置、width と height は範囲の大きさです。この4つで完全なトリミング枠を表せます。収まる最大の長方形を選ぶため、両方向を不要に縮めて利用可能な領域を無駄にすることはありません。画像の再サンプリング、引き伸ばし、余白追加は行わず、中央のどの領域を残すかだけを示します。
中央配置と小数座標の意味を確認します
中央配置のトリミングでは、向かい合う2辺から同じ量を取り除きます。横長画像を狭くする場合、x は除去する幅の半分となり、y はゼロです。縦長画像や正方形の高さを減らす場合、y は除去する高さの半分となり、x はゼロです。画像寸法と比率の組み合わせによっては、座標や範囲サイズが小数になります。これは数学的に正しく、厳密な中心や比率が物理ピクセルの間に位置することがあるためです。多くの画像ライブラリは小数の領域を受け付けるか、描画時に独自のサンプリングを行います。整数のみを受け付けるライブラリでは、最終連携時にその仕様で定められた丸め方を適用してください。丸めたピクセル範囲は指定比率とわずかに異なる場合があります。精密値を保持することで、任意の丸め規則を押し付けず、ブラウザー、API、自動処理で一貫した結果を得られます。
画像処理フローで結果を安全に利用します
返される値は加工済み画像ではなく、幾何情報として扱ってください。x、y、width、height を、利用する画像ライブラリ、コマンドラインツール、canvas 処理、メディアサービスの切り抜き機能へ渡します。連携先が左上を原点にしているか確認してください。この計算では一般的な方式を採用し、x は右方向、y は下方向へ増加します。ファイル名や別バージョンのメタデータではなく、実際にデコードした画像の寸法を使用してください。比率欄には、コロンで区切った2つの正の数値だけを指定します。不正な文字列、ゼロ、負数、別の区切り記号は推測せず拒否します。この厳格さにより、一括処理で大量の誤った画像を生成する事故を防げます。ネットワーク、乱数、日時、非公開の画像解析は使用しないため、同じ入力からは常に同じ座標が得られ、キャッシュやビルド記録にも保存できます。
活用例
SNS向け素材の比率を統一します
媒体別の画像を生成する前に、1:1、4:5、9:16 の中央範囲を計算できます。
サムネイル処理を自動化します
決定的な座標を画像処理へ渡し、変形や余白なしで各フレームを満たせます。
編集用の構図を事前確認します
被写体に合わせた調整を担当者が決める前に、最大の中央領域を表示できます。
よくある質問
画像の切り抜きやアップロードも行われますか?
いいえ。寸法と比率から座標を計算するだけで、画像データの受信、保存、デコード、変更は行いません。
計算料金はいくらですか?
API は1リクエスト $0.002 です。ブラウザー版では同じ決定的な計算を端末内で実行します。
結果に小数のピクセルが含まれるのはなぜですか?
厳密な中心や比率がピクセル間に位置するためです。小数座標なら数学的に最大の中央範囲を保てます。
どのような比率表記を利用できますか?
16:9、4:3、1:1、1.85:1 のように、2つの正数をコロンで区切ります。別の記号や追加文字は使用できません。
範囲が元画像の外へ出ることはありますか?
ありません。一方の寸法は常に元画像と一致し、もう一方だけを指定比率に合うよう縮めます。
開発者向け — APIアクセス
このページの機能はすべてAPIからも利用できます。自社システムに組み込みたいチーム向けのセクションです。それ以外の方は上のツールをそのままお使いください。
エンドポイント
Bearerトークンで認証し、POST1回でタスクをキューに登録します。結果はWebhookまたは署名付きリンクで受け取れます。
お使いのスタックから呼び出す
curl -X POST https://api.kit.forhosting.com/image/crop-to-aspect \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"width":1920,"height":1080,"ratio":"4:3"}'const res = await fetch("https://api.kit.forhosting.com/image/crop-to-aspect", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"width": 1920,
"height": 1080,
"ratio": "4:3"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/image/crop-to-aspect",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"width": 1920,
"height": 1080,
"ratio": "4:3"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/image/crop-to-aspect", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"width":1920,"height":1080,"ratio":"4:3"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"width":1920,"height":1080,"ratio":"4:3"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/image/crop-to-aspect", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)リクエスト例
{
"width": 1920,
"height": 1080,
"ratio": "4:3"
}レスポンス例
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "image.crop_to_aspect",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}非同期APIです。task_idは即時に返ります。ポーリングは1秒あたり1リクエストまでです。
料金
単価はすべて公開しています。トークン換算や独自クレジットはありません。失敗したタスクは課金されません。
制限
max_mb | 15 |
max_megapixels | 12 |
エラー
| HTTP | コード | 意味 |
|---|---|---|
401 | unauthorized | APIキーが無効か、指定されていません。Authorizationヘッダーを確認してください。 |
402 | insufficient_balance | 残高が不足しています。チャージ後に再度お試しください。 |
404 | unknown_type | 指定されたタスクタイプは存在しません。タイプ名を確認してください。 |
429 | rate_limited | リクエストが多すぎます。しばらく待ってから再度お試しください。 |