メインコンテンツへスキップ

すべての処理はブラウザ内でローカルに実行

Image Machine logo
Image Machine

バイブランス&彩度 — オンラインで色をクリッピングせずに強調

調整する画像をアップロード

対応形式: JPG、PNG、WEBP、BMP、GIF(非アニメーション)

画像をアップロード

画像を貼り付け(Ctrl/⌘+V)またはドロップ — URLからの読み込みも可能

Vibranceはよりスマートで非線形な彩度コントロールです。通常のSaturationがすべての色を同じ量で強度を掛け算し——空・肌・すでに明るい色を表示できる限界を超えて素早く押し出してハーシュでクリップされた「ネオン」な見た目になる——のに対し、Vibranceは中程度の彩度の色に最も強く両端に向かって弱まる重み付きブーストを適用します。ほぼグレーとすでに鮮やかなピクセルは最も変化が少なく、ミュートされた中間域の色が最大のブーストを受けます。結果は漫画的な過剰彩度なしに豊かで生き生きとした写真で、これがLightroomや多くのスマートフォンカメラアプリで「ポップ」スライダーとしてVibranceが選ばれる理由です。このツールは両方を提供します:保護された非線形ブーストのVibranceスライダーと、上に重ねるクラシックな均一調整のSaturationスライダー。どちらかを右にドラッグして色を強調し、左にドラッグしてグレースケールに向けてミュートします。HSLカラースペースで動作するため、各ピクセルの彩度だけが変わります——色相と輝度は保持され、完全にグレーなピクセルは正確にグレーのままです。すべてブラウザ内のHTMLキャンバス上でローカル実行:画像のアップロード不要、透明度は保持、登録不要・透かしなし。

自然な彩度と彩度を、同じ写真で実測する

何が起きるか彩度 +50自然な彩度 +50
上限まで押されてディテールが消えた色1,080,000ピクセルのうち 304,138、つまり写真の 28.16% が潰れました。0ピクセル。小さな数を丸めて0になったのではありません。自然な彩度の持ち上げ量は色が最大彩度に近づくほど0に縮むので、そもそも限界を越えさせられないのです。
もともと鮮やかだった色(0.7以上、この写真では 294,801 ピクセル)彩度が 0.147 上がります。0.058 しか上がりません。2.5倍少ない。両者が食い違うのはここです。
もともとくすんでいた色(0.3未満、この写真では 336,124 ピクセル)彩度が 0.105 上がります。0.080 上がります。ここでは両者はほぼ一致します。この違いが普段語られる説明とは逆です。
グレーそのまま。色を持たないピクセルには掛けるものがありません。同じ理由でそのまま。両方のスライダーが0のとき完全な無操作です。1,080,000ピクセルのうち0が変化しました。
色相と明るさ明るさは最大で255分の0.5、色相は最大10度動きます。明るさは同じく255分の0.5、色相は最大5.14度。どちらのスライダーも透明度は1バイトも書きません。

1200x900の写真(1,080,000ピクセル)をこのページ自身のコードに通して測定しました。代役ではなく、ブラウザが実行しているまさにその applyVibranceToData です。scripts/measure-vibrance.mts で再現できます。2つのスライダーの違いは項ひとつから来ます。彩度は掛け算なので持ち上げ量は元の彩度に比例して直線的に伸び、自然な彩度は s(1-s) で重み付けした量を足すので中央で最大、両端で0になります。+50のとき、彩度0.10のピクセルへの持ち上げは彩度が+0.050、自然な彩度が+0.045。0.50では+0.250に対して+0.125、0.90では+0.100に対して+0.045です。ただし0.75と0.90では彩度はすでに天井にぶつかって止まっており、潰れた304,138ピクセルとはそれのことです。したがって実用的な規則は「自然な彩度はくすんだ色をより持ち上げる」ではありません。持ち上げていません。自然な彩度は鮮やかな色に手を出さない、というのが規則であり、最初に壊れるのはその鮮やかな色なのです。よく言われることへの正直な訂正がもうひとつ。確かめるまではこのページもそう書いていました。色相は完全には保たれません。HSLに変換して1チャンネルだけ変えて戻すと整数バイトに丸められ、グレーに近い色こそ1単位の丸めが色相を最も大きく振る場所です。自然な彩度で最悪5.14度、彩度で最悪10度。その幅なら目には見えませんが、これは断言ではなく測定値です。

使い方

1

ツールを選ぶ

168+種類のツールから選んで、画像のサイズ変更・変換・圧縮・補正ができます。

2

アップロードして編集

画像をドラッグ&ドロップして設定を調整します。データはデバイス内に保持されます。

3

ダウンロード

結果をすぐに保存 — 透かしなし、登録も不要です。

Image Machine が選ばれる理由

ファイルがデバイスの外に出ることはありません

すべての処理はブラウザ内でローカルに実行されます。画像がサーバーにアップロードされることは一切ありません。

完全無料

すべてのツールが無料。制限も、透かしも、隠れた費用もありません。

圧倒的な速さ

アップロードの待ち時間なし — 画像はお使いのデバイス上で瞬時に処理されます。

プロ品質

ピクセル単位で美しい仕上がり。形式・サイズ・品質を自由にコントロールできます。

よくある質問

VibranceとSaturationの違いは?

Saturationはすべてのピクセルの色鮮やかさを同じ係数で掛け算するため、鈍い色も鮮やかな色も同様にブーストします——すでに明るい色を表示できる限界を超えて素早く押し出し、ハーシュでクリップされた「ネオン」な見た目になります。Vibranceは代わりに重み付きブーストを適用します:加えるリフトは中程度の彩度の色に最も強く両端に向かって弱まるため、ほぼグレーとすでに鮮やかな色はほとんど変化しないのに対し、ミュートされた中間域が最大のゲインを得ます。要するに、SaturationはユニフォームなブーストでVibranceは保護されたブーストです——最も彩度の高い領域を飛ばさずに豊かな色を望む場合はVibranceを選びましょう。

Vibranceはポートレートや肌の色調に適していますか?

通常はそうです。Vibranceは何らかの彩度を既に持つ色にフラットなSaturationバンプより少ないブーストを追加し——色が完全な彩度に近づくにつれてさらに弱まります——肌の色調や他のすでに色のある領域に対してより優しく、ポートレートに活力を与えつつ肌をオレンジや斑点状にしません。良いワークフローはほとんどのリフトにVibranceを使い、画像全体がまだフラットに見える場合にだけわずかなSaturationを追加することです。

色をミュートするまたは写真をグレースケールにするのにも使えますか?

はい。両方のスライダーはネガティブ方向にも機能します。Saturationを完全に左にドラッグしてすべての色をグレースケールに引き込むか、途中まで下げてフェードしたミュートなフィルムルックに。ネガティブVibranceは同じ保護的な重み付けを使って色を穏やかに下げます——完全にグレーのピクセルは常にグレーのまま——過色彩な画像を完全にフラットにせずにトーンダウンするのに便利です。

画像はアップロードされますか?透明度は保持されますか?

アップロードなし——Vibrance & SaturationはHTMLキャンバス上でブラウザ内で完全に実行されます。画像がデバイスから外に出ることはなく、ページ読み込み後はオフラインで動作します。調整はHSLカラースペースで行われ各ピクセルの彩度だけを変更します:色相と輝度は保持され、完全にグレーのピクセルは正確にグレーのままで、アルファチャンネルはそのまま残るためPNGの透明な領域は透明のままです。登録不要・透かしなしです。

編集ツール

画像を反転

GIFをスプライトシートに

チャンネルミキサー

フィルムグレイン

ティルトシフト

ピクセルソート