テキストの配色から視認性をチェックする -Colour Contrast Check

前景と背景のカラーコントラストをオンラインでチェックできる「Colour Contrast Check」をsnook.caから紹介します。

Colour Contrast Checkのキャプチャ

Colour Contrast Check

テキストの視認性はカラーだけでなく、サイズや行間なども重要なポイントですが、ここでは前景色と背景色のコントラストを数値でチェックし、その視認度を確認することができます。

使い方は簡単で、左に前景色、中央に背景色を入力すると、右にそのカラーコントラストの結果が表示されます。

項目は上から順に。

Brightness Difference
明度差
Colour Difference

色差
Are colours compliant?
色の組み合わせが良いか、悪いか、まぁまぁか
Contrast Ratio
コントラスト比
WCAG 2 Contrast Compliant at 18pt or larger
WCAG 2 Contrast Compliant under 18pt
18pt以上か未満で、WCAG 2に準拠しているかどうか。

sponsors

top of page

©2018 coliss