アイコン画像を丸く切り抜く方法｜プロフィール用の透過PNGを作成

最初に元画像を読み込み、円形にしたい範囲を正方形として決めます。横長・縦長の写真をそのまま円へ押し込むのではなく、短い辺に合わせた正方形の中で位置と拡大率を調整します。

次に円形プレビューを見ながら、顔、商品、ロゴなどの主要部分が中央付近に収まるように動かします。最後に円の外側が透明なPNGとして出力し、保存した画像をもう一度開いて確認します。

ブラウザやSNSの画面では、正方形画像へ丸いマスクをかけて表示することがあります。この場合、見た目は丸くても元ファイルの四隅は残っています。一方、丸抜き画像は円の外側を透明にしたファイルです。

プロフィール欄へアップロードするだけならサービス側が自動で丸く表示する場合もあります。画像素材として配布する、スライドやWebページへ重ねる、別の背景色でも使う場合は、透明PNGにしておくと扱いやすくなります。

円形では正方形の四隅が見えなくなるため、長方形の写真でちょうどよく見えていた要素が欠けることがあります。顔写真なら頭頂部、髪、肩、帽子が円周へ触れていないか確認します。ロゴなら文字や細い線が円の外側へ出ていないかを見ます。

中央へ置くことは出発点ですが、必ずしも数値上の中央が最適とは限りません。人物の目線やロゴの形に合わせて少し上下左右へ動かし、32〜64px程度まで小さくした表示でも主要部分が認識できる位置を選びます。

JPGは透明な部分を保持できません。円の外側を透明にして保存したい場合はPNGを使います。透明PNGなら、白、黒、写真、ブランドカラーなど異なる背景へ置いても、四角い背景色が残りません。

ただし、アップロード先が透明画像を別の背景色へ置き換える場合や、ファイル形式を自動変換する場合もあります。用途先へ一度アップロードし、実際の背景色と表示範囲で確認してください。背景色を固定したい場合は、円の外側を透明にせず、正方形の背景を含めて保存する選択肢もあります。

出力サイズは、アップロード先が指定する正方形サイズを優先します。指定が分からない場合は、元画像の解像度を超えて無理に拡大せず、複数用途へ使いやすい正方形サイズで保存します。

画面では小さく表示されても、高密度ディスプレイや編集時の再利用を考えると少し大きめの元データが便利です。一方、必要以上に大きい画像は容量が増えるため、保存後に容量も確認します。

失敗の多くは、円形プレビューではなく正方形だけを見て位置を決めること、主要部分を円周へ近づけすぎること、JPGで保存して透明部分を失うことから起こります。

また、低解像度の画像を大きく拡大すると輪郭がぼやけます。元画像が小さい場合は、必要な表示サイズに合わせて出力し、無理に大きなファイルを作らない方が自然に見えます。

「画像を丸く切り抜く」ツールで画像を選び、用途または出力サイズを決めます。プレビューをドラッグして位置を調整し、拡大・縮小しながら円の中へ主要部分を収めます。

出力前に円周付近、背景、容量の目安を確認し、PNGをダウンロードします。処理は対応ブラウザ内で行われ、選んだ画像そのものをToolerのサーバーへアップロードして保存する処理はありません。

丸抜き後は、ファイル名だけで判断せず、画像容量・サイズ確認でPNG形式、幅・高さ、容量を確認します。アップロード先に容量上限がある場合は、上限より少し小さくなるよう余裕を残します。

容量が大きい場合は、まず出力サイズが用途より大きすぎないか確認します。サイズが適切でも重い場合は圧縮を検討しますが、透明部分が必要なら透過を維持できる方法かを確かめてください。