本文へスキップ

明るさ・色の補正

Brightness & Colour Adjust

ヒストグラムを見ながら明るさ・コントラスト・彩度・色温度・シャープネスを調整します。

よく一緒くたにされ、そうすべきでない2種類の調整があります。上の群はCSSのフィルター関数で、仕様どおりに計算するので、下に出るCSSはブラウザでも同じ絵を作ります。下の群は写真のためのもの——露出、ホワイトバランス、ガンマ——で、そうした操作が本来定義されている線形の光の中で働きます。

🔒 ブラウザの中だけで動きますfilteradjustphotocolor

写真を置いてください

補正はこのタブの中で走ります。大きな画像は少し時間がかかります。何もアップロードしません。

使い方

  1. 調整してCSSをコピーします

    上の群で触ったものは、パネルの下のフィルター文字列に現れます。スタイルシートに貼れば、ブラウザはここに見えているものを描きます。

  2. 写真には明るさではなく露出を使います

    露出は段数です。+1で光が2倍になり、これはピクセル値を2倍にするのとは違います。写真の上では、カメラと同じようにふるまいます。

  3. 白飛び・黒つぶれの数値を見ます

    ヒストグラムの両端の突出は256階級のうちの1つで、グラフの上では見えません。だからその割合を隣に書いています。

よくある質問

明るさと露出が両方あるのはなぜですか

別の操作だからです。`brightness()`はsRGBの符号値を掛け算します。ブラウザがやっていることです。露出は光を掛け算します。カメラがやっていることです。前者はCSSで再現でき、後者は写真の上で正しい結果になります。

白飛びした空を戻せますか

戻せません。白飛びとは、そこのピクセルが全部255で、区別するものが何も残っていないという意味です。露出を下げれば白が灰色になるだけで、雲は戻りません。

自然な彩度は、彩度と何が違うのですか

そのピクセルがすでにどれだけ鮮やかかで増分に重みを付けるので、くすんだ空は大きく動き、肌の色は少ししか動きません。ただの彩度はすべてを等しく動かします。顔がオレンジになるのは、それが理由です。

ここから渡せます

次の一手

このツールが出したものをそのまま受け取れる道具です。