スクエア画像

ぼかしフレーム

写真全体を固定の縦横比に収め、余った部分を同じ画像を拡大してぼかしたコピーで埋めます。何も切り取られず、ファイルはブラウザから出ません。

要点

SquareImage.dev の Blurred Frame は、写真全体を固定の縦横比に収め、余った部分を同じ写真を拡大してぼかしたコピーで埋めるため、何も切り取られません。結果は 4 つの操作で決まります。縦横比(1:1・2:3・16:9 または任意指定)、メイン画像の拡大率、背景の拡大率、ぼかしの強さです。書き出しは PNG のみで、エディターの作業領域の 4 倍の解像度になり、一度に 1 枚ずつ処理します。JPEG や WebP が必要な場合は squareimage.dev のメイン変換ツールをお使いください。無料でアカウント登録は不要、画像はアップロードではなく端末上の Canvas で合成されます。

By · Verified

ぼかしフレームはどう作る?

  1. 写真を読み込む。クリック、ドラッグ、または貼り付けます。
  2. 縦横比を選ぶ。1:1・2:3・16:9、または任意の比率を入力します。
  3. スライダーを調整する。画像サイズ、背景サイズ、ぼかしを設定します。
  4. PNG でダウンロードします。

4 つの操作は何をする?

  • 縦横比:書き出される領域の形を決めます。
  • メイン画像の拡大率:枠の中で鮮明な写真が占める大きさです。
  • 背景の拡大率:ぼかしたコピーをどれだけ拡大するかです。
  • ぼかし:前景と背景をどれだけ見分けやすくするかです。

なぜ PNG でしか書き出せない?

このツールは PNG のみ、エディターの作業領域の 4 倍の解像度で書き出します。ぼかし背景のなめらかな階調に圧縮ノイズが乗らないようにするためです。

JPEG や WebP が必要な場合はトップページのメイン変換ツールを使ってください。同じモードをより多くの出力形式で利用できます。

写真はサーバーにアップロードされますか?

いいえ。画像はブラウザのファイル API で読み込まれ、ローカルの Canvas 上で合成されます。当サイトのサーバーには送信されません。

制限は 2 つ。一度に 1 枚ずつの処理で、非常に大きな書き出しはモバイルブラウザのメモリを超えることがあります。

よくある質問

写真の一部が切れますか?

いいえ。写真全体がそのまま残り、空いた部分だけがぼかしコピーで埋まります。

任意の縦横比を指定できますか?

はい。1:1・2:3・16:9 のほか、4:5 など任意の比率を入力できます。

保存形式は?

PNG のみ、作業領域の 4 倍の解像度です。JPEG や WebP はメイン変換ツールをお使いください。

このサイトのツールはすべて、写真を HTML canvas に描画し、その結果を読み出します。処理はそれだけです。だからアップロードは発生しません。ブラウザ自身のドキュメントは描画処理をこう説明しています:

drawImage() will always use the source element's intrinsic size in CSS pixels when drawing, cropping, and/or scaling.
MDN Web Docs, CanvasRenderingContext2D: drawImage() method

出典

リンク確認日: 2026-09-03