画像の角を丸くする（角丸加工）

「角の半径」は「%」と「px」を切り替えられます。%は短い辺に対する割合なので、サイズの違うスクショや写真をまとめて加工しても、どれも同じ比率の丸みにそろいます。デザインカンプで「角丸16px」のように数値が決まっているなら、pxに切り替えてその値を入れてください。スライダーはpxで0〜1000まで動きますが、実際の半径は短い辺の半分で頭打ちになります。設定欄には、プレビュー中の画像で何pxになるかが表示されます。

目安として、写真やスクショを少し柔らかく見せたいなら3〜10%程度です。アプリアイコン風にしたい正方形の画像なら、もう少し大きめの値を試してみてください。ただしこのツールの角は円弧で、iPhoneのアイコンのような角から辺へなめらかにつながる曲線（スーパー楕円）とは形が少し違います。50%にすると正方形は円に、長方形は両端が半円のカプセル形になります。写真の一部を円形に切り抜きたい場合は、位置を選べる円形切り抜きツールのほうが向いています。

「出力形式」はPNG（初期値）・JPG・WebPから選べます。PNGとWebPは透明を保持できるので、切り取った角は透明のまま保存され、どんな背景色のスライドやページに置いても四隅に色が残りません。縁はアンチエイリアス処理されていて、境目のピクセルが半透明になるため、角がギザギザに見えることもありません。

JPGは透明を扱えない形式です。JPGを選ぶと「角の塗りつぶし色」の設定が現れ、角はその色（初期値は白）で埋められます。貼り付け先の背景色に合わせて、たとえば濃いグレーのスライドなら#333333を指定すれば、見た目には角が切り抜かれたように見えます。SNSやブログサービスの中には、投稿したPNGをJPGに変換するものがあり、その場合は透明だった角が白や黒になることがあります。そうした投稿先では、最初からJPGで背景色を合わせて書き出しておくのが確実です。

ファイルサイズは形式で大きく変わります。1200×800、224,092バイトのJPG写真を初期設定で角丸にしたところ、PNGでは1,467,996バイト、WebPでは180,246バイト、JPGでは223,484バイトでした。PNGは可逆圧縮なので写真だと重くなります。Webページに載せる写真なら、透明を保ったまま軽くできるWebPがおすすめです。JPGとWebPには「画質」スライダー（初期値92）が使えます。

自分で管理しているWebサイトなら、CSSのborder-radiusで画像ファイルに手を加えずに角を丸く表示できます。ところが、それが効かない場所は意外と多くあります。Windows版のOutlookはHTMLメールをWordのエンジンで表示するためborder-radiusを無視しますし、Wordの文書やSNSの投稿、ECモールの商品ページでは画像がアップロードしたとおりに表示されます。ファイル自体の角を丸くしておけば、どこに置いても同じ角丸になります。

PowerPointには「図の形式」の「トリミング」から図形に合わせて角丸四角形に切り抜く機能がありますが、これはスライド上の表示設定です。画像として書き出したり、KeynoteやGoogleスライドに持っていったりすると、元の四角い画像に戻ることがあります。角丸にしたファイルを用意しておけば、どのソフトに貼ってもそのまま使えます。

加工しても画像の幅と高さは変わらず、変わるのは丸めた角の外側のピクセルだけです。読み込み時にスマホ写真の回転情報は反映されますが、撮影日時や位置情報などのExifは書き出したファイルにコピーされません。