色にガンマ補正を適用

ガンマ補正は、HSLで明度を動かすのでも白へ混ぜるのでもなく、赤・緑・青の各チャネルをべき乗することで色の見え方の明るさを再形成します。デザイナー、グラフィックスエンジニア、アクセシビリティのレビュー担当者は、純黒と純白の端点を保ったままその間を再形成する非線形の明るさ調整が必要なときにガンマ指数を用います。本ツールはCSSのhex色と、ちょうどゼロより大きく十までの半開区間にあるガンマ値を受け取り、正規化したチャネルをガンマ乗したうえで二百五十五倍する古典的なチャネルごとの式を適用し、補正後のhexとRGB整数を返します。一未満は中間調を上げ、一超は下げ、一は見本を変えません。

ガンマがRGBチャネルに与える効果

ハッシュ三・三・六・六・c・cのようなCSS hex色、または短い形のハッシュ三・六・cから始めます。パーサは三桁コードを展開し、桁を小文字化し、各対をゼロから二百五十五までの赤・緑・青の整数へ変換します。各チャネルは二百五十五で割って単位区間に正規化されます。

その後、浮動小数点のべき乗でガンマ指数を適用します。単位分数をガンマ乗し、再び二百五十五を掛けて最も近い整数へ丸めると、ゼロから二百五十五の合法範囲にクランプされた出力チャネルが得られます。ゼロを正の任意のべきにするとゼロのままなので黒は黒のままです。

一を任意のべきにしても一なので白は白のままです。端点の間はすべてべき曲線に沿って動き、一未満のガンマは曲線を上に曲げて中間調を明るくし、一超は下に曲げて暗くし、一は純粋な恒等変換です。同じ指数が赤・緑・青に独立して掛かるため、色相と彩度を固定するHSL明度の移動と比べ、相対的なチャネルバランスはわずかにずれ得ます。

その差は意図的です。 ガンマ補正は表示・撮像の古典的なべき曲線であり、知覚的な明度スライダではありません。四桁・八桁のアルファ付きhexは、この契約が不透明RGBのみであるため拒否されます。

入力契約、応答の形、検証

colorはhex文字列、gammaはゼロより大きく最大十の有限数です。成功時は正規化された六桁の色と数値ガンマをエコーし、originalとresultの見本を返します。各見本にはrole、hex、整数のr g b、表示用のrgb文字列が含まれます。

トップレベルのhex、r、g、bは一行クライアント向けにガンマ補正後の結果を反映します。短いformula文字列はチャネルごとのべき規則を文書化とサポート用に示します。典型的な確認は、中間の青にガンマ二点二を適用する、中間調を明るくするために純赤にガンマ零点五を適用する、ガンマ一が元のhexを返すことを確認する、ガンマ十五や色の欠落を拒否する、などです。

素早いプレビューには無料のブラウザフォームを配線し、トークンの一括生成や継続的インテグレーションの検査が必要なときはスクリプトから同一契約を呼び出してください。黙ったクランプに頼らず、文書化された区間内にガンマを保ってください。このツールは設計システムとレンダリングパイプラインが環境間で予測可能であるよう、はっきり失敗します。

ガンマ補正が役立つ場面

表示・撮像パイプラインはしばしば二点二付近のべき曲線で輝度を符号化または復号します。ブランド見本を出す製品チームは、フル画像エディタを開かずに単一のhexで同じ数学をプレビューする小さく文書化された手段を依然として必要とします。

デザイントークンの著者は、HSLの明暗調整がブランドブックには直線的すぎるときに、ベース色へガンマを掃引して非線形なトーン段を生成します。アクセシビリティのレビュー担当者は純黒と純白を固定したままテキストやアイコン色のより暗い・明るい同伴色を試し、候補をコントラストチェッカーへ渡します。

マーケティングやプレゼン用ツールは、単純な百分率の明度アップが色相を薄めるときに、彩度の高いロゴから柔らかくまたは力強いキャンペーン見本を作ります。後でHSL明度アップ、百分率での暗化、二つのhexの混合、WCAGコントラスト確認が必要なら、このガンマページを過負荷にせず、別の検索意図とランディングとして扱ってください。