ホーム 画像ビネット

画像ビネット

写真の四隅を暗くしてクラシックな額縁風の見た目に——100% ブラウザ内で完結。

ソース

画像をここにドロップ

またはクリックして選択

.jpg.png.webp.gif.bmp

オプション

元画像
ビネット後

画像ビネットとは

ビネットは、画像の中央を明るく保ったまま、縁と四隅を徐々に暗くする視覚効果です。結果は、柔らかい円形の額縁を通して写真を見ているかのように見え、視線を画面中央へと誘導します。ビネットは多くのレンズ——特に大口径やビンテージ設計——で自然に発生し、ポートレート・ウェディング・シネマティック写真でムードを加え、被写体に注意を集中させるために意図的に加えられることがよくあります。

本ツールはこの見た目をデジタルかつ完全にブラウザ内で再現します。画像をアップロードし、強度スライダーで暗化の強さを選ぶと、ツールは各ピクセルを走査して画像中心からの距離を計算し、四隅付近のピクセルが中心付近のピクセルよりも多く暗くなるよう RGB チャンネルに減衰係数を掛けます。パイプライン全体が JavaScript と Canvas API でローカル実行されるため、何もアップロードされず、結果はほぼ瞬時に得られます。

ビネットフィルタの仕組み

本ツールは内部的に Canvas 2D API を使用します。ソース画像がオフスクリーンキャンバスに描画され、getImageData が生のピクセルバッファを返します。各ピクセルについて、画像の幾何中心からのユークリッド距離を計算し、中心から角までの距離(取り得る最大距離)で正規化し、結果を二乗して滑らかな半径方向の減衰曲線を生成します。この減衰値に強度係数を掛け、各 RGB チャンネルを 1 − 強度 × 減衰² でスケーリングするため、まさに中央は変更されず、四隅が最大の暗化を受けます。

正規化距離を二乗することで、硬いリングではなく滑らかで自然なグラデーションが生まれます。強度 0% では画像は変化せず、50% では四隅の明るさが元の約半分になり、100% では四隅が完全に黒に押し込まれます。変換は単純なピクセル単位の操作なので、大きな画像でも非常に高速です。

ビネットと他の暗化効果の違い

ビネットは単に画像の明るさを下げることとは異なります。明るさ低下はすべてのピクセルを同じ量だけ暗くし、画像を平坦にしてディテールを薄めます。一方ビネットは放射状グラデーションを適用し、中央は完全な明るさを保ったまま縁だけが後退するため、主体を保ちつつ周辺を淡くします。これにより視線は自然に画面中央へと向かいます。

黒一色の額縁と比べると、ビネットは暗化が徐々に強まるためはるかに柔らかいです。グラデーションオーバーレイと比べると、ビネットは幾何的であり、単一方向ではなく常に画像中心に従うため、横長・縦長・正方形いずれの切り抜きでも同様に機能します。結果はほぼあらゆる被写体に映えるクラシックな写真の見た目です。

ビネットを使う場面

ビネットは多様な写真・デザイン分野で使われる万能な仕上げ手法です。四隅をわずかに暗くするだけで平坦なスナップショットが洗練された画像になり、より強いビネットはドラマと雰囲気を加えます。よくある場面は以下の通りです:

  • ポートレートとウェディング。縁を暗くして視線が被写体の顔にロックするようにし、賑やかな背景から切り離します。
  • 商品写真。穏やかなビネットで商品を周囲の白やグレーのシームレス背景から浮かび上がらせます。
  • シネマティック静止画。強いビネットを追加してアナモフィックレンズの見た目を再現し、アクションの中心に注意を向けます。
  • ビンテージとローファイ。ビネットをセピアや粒子フィルタと組み合わせ、四隅が自然に暗くなる古いフィルムカメラを模倣します。
  • Web とグラフィックデザイン。ヒーロー画像の縁を柔らかくし、重ねたテキストや UI 要素をより読みやすくします。

画像をより焦点を絞った、よりドラマチックな、あるいはより懐かしい感じにしたい時、ビネットは最速の手段です。

画像にビネットを追加する方法

ビネットの追加は数秒で完了し、すべてブラウザ内で実行されます——アップロードなし、サインアップなし、透かしなし。以下の手順に従ってください:

  1. 画像をアップロード。アップロードエリアをクリックするか、JPG・PNG・WebP・GIF・BMP ファイルをドラッグ&ドロップします。画像は即座にデコードされプレビューされます。
  2. 強度を設定。0 から 100% のスライダーを使います。値を大きくすると四隅がより暗くなり、額縁効果が強くなります。
  3. 出力形式を選択。PNG でロスレス品質、JPG でより小さい写真、WebP でサイズと品質の現代的なバランスを選べます。
  4. ビネットを適用をクリック。ツールが画像を処理し、元と結果のファイルサイズを並べて表示します。
  5. 結果をダウンロード。「ビネット画像をダウンロード」をクリックして保存します。元のファイルはそのまま残ります。

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

このビネットツールは無料ですか?

はい、完全無料で登録不要・透かしなし・制限なしです。

どのくらいの強度を使うべきですか?

バランスの取れた自然な見た目には 50% から始めてください。ドラマチックなシネマ風には 100% に、ほとんど見えない仕上げには 20〜30% に下げます。

ビネットは画像の中央に影響しますか?

いいえ。まさに中央は変更されず、縁と四隅だけが暗くなり、その間は滑らかに推移します。

画像はアップロードされますか?

いいえ。すべての処理はローカルです。画像がブラウザから外に出ることはありません。