オンラインで画像に丸い角を追加する方法

CSS border-radius Web サイト上の画像を丸くすることはできますが、それはブラウザーでのみ機能します。基になる画像ファイルには依然として鋭い角があります。その画像を電子メール、プレゼンテーション、またはソーシャル メディアの投稿で共有すると、角は鋭い長方形に戻ります。丸い角を画像ピクセルに直接適用することで、その効果がどこにでも持続します。

角を丸くすることもアプリのアイコンには不可欠です。 iOS は特定の角丸長方形 (超楕円) 形状を使用し、Android はさまざまな丸みを帯びた形状を使用します。私たちのツールを使用すると、必要な正確な半径をダイヤルできます。

ステップ 1: 画像をアップロードします。 を開きます 画像の角を丸くする ツールを使用して写真をドラッグ アンド ドロップするか、クリックして参照します。 PNG、JPG、WebP ファイルはすべてサポートされています。

ステップ 2: コーナーの半径を調整します。 スライダーを使用して、半径を 0% (鋭角) から 50% (完全に丸い) まで設定します。または、プリセット ボタンを使用します:微妙 (10%)、中 (20%)、ラウンド (35%)、またはフル (50%)。プレビューはリアルタイムで更新されます。

ステップ 3: ダウンロードします。 透明なコーナーには PNG (背景にオーバーレイするのに最適)、または白で塗りつぶした JPG/WebP を選択します。 「ダウンロード」をクリックすると、角の丸い画像が完成します。

角の半径は、画像の短辺のパーセンテージとして表されます。実際の各プリセットは次のようになります。

微妙 (10%): 画像の形状を大きく変えることなく、シャープなエッジを和らげる緩やかなカーブ。製品画像やスクリーンショットに最適です。

中 (20%): デフォルト — カード、サムネイル、プレゼンテーションを含むほとんどのユースケースに適した、目立ちますがバランスの取れた丸めです。

ラウンド (35%): スクイクルのような外観に近づく顕著な曲線。アプリのアイコンの近似やデザイン要素に最適です。

フル (50%): 最大丸め — 正方形の画像を円に変換します。長方形の画像の場合、短辺にスタジアム (錠剤) 形状を作成します。

アプリのアイコン: iOS および Android アプリのアイコンは角丸長方形を使用します。プラットフォームのガイドラインに一致させるには、Round または Full プリセットを使用します。

製品画像: 電子商取引商品カードは、角が微妙に丸くなっており、よりモダンに見えます。

プレゼンテーション: 角が丸いスクリーンショットや写真は、スライドデッキやレポートでより洗練されて見えます。

電子メールニュースレター: CSS の境界半径のサポートは電子メール クライアント間で一貫していないため、画像に丸い角をベイク処理することで一貫したレンダリングが保証されます。

CSS border-radius レンダリング環境を制御する Web ページに最適です。ただし、共有、印刷、または CSS をサポートしていないコンテキストでの使用など、画像ファイル自体に丸みを帯びた効果を焼き付ける必要がある場合には、このツールの方が適しています。

すべての iFormat ツールと同様、角丸ツールはブラウザ内のすべてを処理します。画像がデバイスから流出することはありません。サーバーへのアップロードやストレージ、プライバシーへの懸念はありません。