色付きの表面に描かれているテキストの最も読みやすい色を見つける

StackOverflow https://stackoverflow.com/questions/646068

質問

これを尋ねる方法がわかりませんが、ここに行きます。

画面に色付きの長方形を塗りつぶします。色はR、G、Bの形式です

次に、四角形の上にテキストを描画しますが、テキストの色は、コントラストが最高になるようにする必要があります。つまり、読みやすくなります。

例：

黒い長方形を描くと、テキストの明白な色は白になります。

今試したのはこれです。この関数に四角形の色を渡すと、反転した色が返され、テキストに使用されます。

動作しますが、最良の方法ではありません。

提案はありますか

// eg. usage: Color textColor = GetInverseLuminance(rectColor);
private Color GetInverseLuminance(Color color)
{
    int greyscale = (int)(255 - ((color.R * 0.30f) + (color.G * 0.59f) + (color.B * 0.11f)));

    return Color.FromArgb(greyscale, greyscale, greyscale);
}
役に立ちましたか？

解決

大幅に異なる色を与えることが保証されている簡単なアプローチの1つは、RGBトリプルの各コンポーネントの最上位ビットを切り替えることです。

Color inverse(Color c)
{
    return new Color(c.R ^ 0x80, c.G ^ 0x80, c.B ^ 0x80);
}

元の色が＃1AF283の場合、「反転」 ＃9A7203になります。

コントラストは重要です。美学については保証しません。

更新、2009/4/3：このスキームや他のスキームを試しました。 私のブログでの結果。

他のヒント

最も読みやすい色は白または黒になります。最も「落ち着いた」色は、白でも黒でもないものになり、背景色とわずかに対照的な色になります。これは主観的であるため、プログラムでこれを行う方法はありません。誰もが物事を異なって見るため、誰にとっても最も読みやすい色を見つけることはできません。

色、特にテキストなどの前景と背景の並置に関するヒント。

人間の目は本質的に単純なレンズであるため、一度に1つの色にのみ効果的に焦点を合わせることができます。最近のほとんどのカメラで使用されているレンズは、屈折率の異なる複数のレンズ（色レンズ）を使用することでこの問題を回避し、すべての色に同時に焦点を合わせますが、人間の目はそれほど高度ではありません。

そのため、ユーザーはテキストを読むために一度に1色だけに集中する必要があります。これは、前景の色または背景のいずれかであるが、両方ではないことを意味します。これは、一般的に振動と呼ばれる状態を引き起こします。シェイプ、しかしそれは決して解決せず、シェイプは決して焦点が合わず、目の疲れにつながります。

RGB（127,127,127）を指定した場合、関数は機能しません。まったく同じ色を返すためです。 （黒または白を返すように関数を変更すると、少し改善されます）

常に読みやすいものにするための最良の方法は、周囲に黒色の白いテキストを配置すること、またはその逆です。

多くの場合、最初に（x-1、y-1）、（x + 1、y-1）、（x + 1、y-1）、（x + 1、x + 1に黒のテキストを描画することで達成されます）、（x、y）に白いテキスト。

別の方法として、最初に半透明の黒いブロックを描画し、次にその上に不透明な白いテキストを描画することもできます。これにより、背景とテキストのコントラストが常に一定になることが保証されます。

なぜグレーですか？黒または白が最適です。暗い色は白、明るい色は黒。輝度がしきい値を超えているかどうかを確認し、いずれかを選択します

（ちなみに、.net、c＃、またはasp.netタグは必要ありません）

色彩理論を勉強する必要があります。 「Color Wheel Pro」というプログラム遊んで楽しいですし、一般的なアイデアを提供します。

本質的に、特定の色の補色を探しています。

とはいえ、色の理論は役立ちますが、微調整するためには人間の目が必要だと思います。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top