12

私が構築している ASP.NET Web アプリのユーザーは、一部の要素 (ボタン/タイトルなど) で使用する色を選択して、ある程度のパーソナライズを容易にすることができます。

問題は、これらのレイヤーのテキストがデフォルトで黒であることです...私がやろうとしているのは、ユーザーがピッカーを介して選択したHEX値を評価し、プログラムで黒と白のテキストを切り替えることです-これはJavaScript、またはコード ビハインド。

問題の核心は、HEX を評価して、選択した色が黒に近すぎて黒のテキストを使用できないかどうかを判断する方法がわからないことです。

何か案は？

4

4 に答える 4

17

他の回答者 (ricknz) が言ったように RGB コンポーネントを一緒に追加する代わりに、実際にはそれらの平均を取る必要があります。

また、緑は青よりも人間の目には見えやすいため、ウェイトも追加する必要があります。

したがって、最初に赤のコンポーネントに 0.299 を掛け、緑に 0.587 を掛け、青に 0.114 を掛ける必要があります。

したがって、輝度は次の式で与えられます: 輝度 = (r*0.299 + g*0.587 + b*0.114)/3

編集:これはそれを計算するスニペットです:

 float calcLuminance(int rgb)
 {
      int r = (rgb & 0xff0000) >> 16;
      int g = (rgb & 0xff00) >> 8;
      int b = (rgb & 0xff);

      return (r*0.299f + g*0.587f + b*0.114f) / 256;
 }

ps RGB が 0-256 (0-1 ではなく) から実行されたため、256 による除算

編集：巧妙にコメントされているように、768ではなく256で割るように計算を変更しました

于 2009-11-18T07:50:03.867 に答える
10

HSLに変換してL輝度値を見てください。これで明るさがわかります。

これは、変換を行うためのJavaScript 関数です。

于 2009-11-18T07:50:01.750 に答える
5

これを行うメソッドは、現在 .Net に組み込まれています。

    var hexcolor = "#FA3CD0";
    var color = System.Drawing.ColorTranslator.FromHtml(hexcolor);
    var brightness = color.GetBrightness();
    if (brightness > .5)
    {
        // color is light
    }
    else
    {
        // color is dark
    }
于 2014-05-21T19:11:43.630 に答える
1

16 進数のカラー コードは、赤、緑、青の 3 つの強度値で構成され、それぞれに 2 つの 16 進数があります。暗いか明るいかを判断するには、3 つの値を足し合わせるだけです。数値が小さいほど、値が大きい場合よりも暗くなります。

#010203 の場合、RGB 値を合計すると 01+02+03 = 06 になります。これは #102030 = 60 よりも暗くなります。

于 2009-11-18T07:32:49.237 に答える