画像円形クロップ

画像の円形クロップとは？

円形クロップとは、長方形画像を完璧な円形に切り取り、4つの角を完全に除去して内接する円だけを残す効果です。円は元の画像の短い方の辺に合わせて配置されます——画像はまず中央で正方形にクロップされ、その正方形が辺の長さを直径とする円にクリップされます。結果は、ほぼすべての現代アプリやソーシャルプラットフォームで使われる古典的な丸いアバターや「プロフィール写真」のシルエットです。

円は角を上書きせず切り取るため、出力はファイル形式に依存します。PNG と WebP は透過に対応しているため、円の外側の領域は完全に透明で、画像はどんな背景にも配置できます。JPG は透過に対応していないため、エンコード時に角は純色（通常は黒）で塗りつぶされます。本ツールは Canvas 2D API でクロップ全体をブラウザ内で行うため、画像がサーバーへアップロードされることはありません。

円形クロップツールの仕組み

本ツールはブラウザの Canvas 2D API を使用します。画像をデコードした後、自然な幅と高さの小さい方を計算し、そのサイズの正方形キャンバスを作成します。元画像は正方形の中央にクロップされ、写真の焦点が中央に保たれます。その後 ctx.arc(size/2, size/2, size/2, 0, Math.PI * 2) で円形クリップパスを構築し、ctx.drawImage でクリップ領域内に画像を描画します。円の内側のピクセルだけが残り、角のすべてが透過として切り取られます。

円は常に正方形の完璧な内接円であるため、調整用のスライダーはありません。ソース画像がすでに正方形なら、結果は画像全体を使ったクリーンな円になります。ソースが横長や縦長の場合、長い方の辺が両側から均等にトリムされ、被写体が中央に保たれます。PNG は透過角を保持するため推奨される出力形式で、WebP も透過に対応します。JPG は透過に対応していないため、切り取られた角はエンコードされたファイル内で黒く塗りつぶされます。

ソースアスペクト比と結果の円

円は常に短辺の正方形に内接するため、ソースのアスペクト比が画像のどこが残るかを決定します。下表は一般的なアスペクト比の扱いを示します：

ソースアスペクト比	残る部分	トリムされる部分
1:1（正方形）	画像全体	4つの角のみ
4:3（横長）	中央の 3:3 正方形	左右の端
16:9（ワイド）	中央の 9:9 正方形	より多くの左右の端
3:4（縦長）	中央の 3:3 正方形	上下の端
9:16（ストーリー / 縦型）	中央の 9:9 正方形	より多くの上下の端

円の内側に残す部分を制御したい場合は、まず専用クロッパーで画像を正方形にクロップしてから本ツールにかけてください——正方形全体が使用されます。

円形クロップを使う場面

丸いシルエットが期待される、あるいは視覚的に適している場合、円形クロップが適切な選択です。よくあるシナリオは以下の通りです：

• アバターとプロフィール画像。ほぼすべてのソーシャルプラットフォーム（Twitter、Instagram、Facebook、LinkedIn、Discord、Slack）はユーザーアバターを円形で表示します——事前に円形にクロップしておけばフレーミングが正しく見えます。
• チームとスタッフページ。丸いヘッドショットは企業サイトの「About us」やチーム一覧ページの事実上の標準です。
• コメントとレビュー。レビューやコメントの横にあるユーザー写真はほぼ常に円形です。
• ロゴとブランドマーク。アプリアイコン、ファビコン、パートナーロゴはしばしば円形コンテナに配置されます——事前に円形にクロップしておけば不格好なレターボックス化を避けられます。
• ステッカーと装飾グラフィック。円形の切り抜きはスクラップブック、チャットステッカー、装飾デザイン要素で人気があります。
• 印刷とグッズ。バッジ、マグカップ、マグネット、ピンの丸い写真は、ソースファイルがすでに透明な円形の場合に制作が容易です。
• 統一感のあるギャラリーレイアウト。横長と縦長の写真を統一された円形グリッドにまとめるのは、多様な画像を提示するクリーンな方法です。

丸いシルエットが必要な場合、ワンクリックの円形クロップがクリーンで透明な結果を得る最速の方法です。

画像を円形にクロップする手順

本ツールで円形にクロップするのは1秒で終わり、すべてブラウザ内で完結します——アップロードなし、サインアップなし、透かしなし。ツールは画像をローカルでデコードし、Canvas API を通じて円形クリップを構築し、必要な形式で出力できます。次の手順で行います：

1. 画像をアップロード。アップロードエリアをクリックするか、JPG・PNG・WebP・GIF・BMP ファイルをドラッグ＆ドロップします。画像は即座にデコードされプレビュー表示されます。
2. 出力形式を選択。透明な角を保持するには PNG または WebP、より小さいファイルが必要な場合は JPG（角は黒で塗りつぶされます）を選びます。
3. 「円形クロップを適用」をクリック。ツールが画像を中央で正方形にクロップし、完璧な円形にクリップして、元の画像と円形クロップ後のファイルサイズを並べて表示します。
4. 円形画像をダウンロード。「円形画像をダウンロード」をクリックして結果を保存します。元のファイルはデバイス上で変更されません。

すべてのステップは JavaScript でブラウザ内ローカルに実行されるため、画像がサーバーへアップロードされることはありません。これにより円形クロップツールは完全にプライベートで高速、機密画像にも適しています。