任意の背景色に対して読みやすい文字色を選択する方法 - Katashin .info2018年12月17日CSS,JavaScript,アクセシビリティGitHub の Issue ラベルなど、任意の色の中に文字を入れたい場合があります。このとき文字色が一色のみだと、背景色と似たような色のときに読みづらくなってしまいます。 以下のスクショでわかるように、GitHub は背景色によって文字色を黒か白のどちらにするかを計算しているようです。 個々のサービスの実装についてはわかりませんが、WCAG (Web Content Accessibility Guidelines) で定義されているコントラスト比を使うことで、背景色に対して読みやすい文字色を選択することができます。 WCAG で定義されているコントラスト比 (contrast ratio) #WCAG は Web のコンテンツを障害者がより利用しやすくするためにはどうするべきかが記された指標です。また一般的に、WCAG
