意味解説
1.テキストの読みやすさを保証するアクセシビリティの指標
専門家向け解説
画面上の最も明るい色（白）と最も暗い色（黒）の相対輝度（Relative Luminance）を比較した比率。1:1（背景と文字の色が完全に同じで、コントラスト（差）が全くない状態）から21:1（白（#FFFFFF）と黒（#000000）の組み合わせ）の範囲で表される。 ウェブアクセシビリティの国際的なガイドライン（WCAG 2.2）の達成基準では、通常テキスト（18pt未満・非太字）はAA基準で4.5:1以上、大テキスト（18pt以上または14pt以上の太字）は3:1以上が必要とされており、最高水準のAAA基準では7:1以上のコントラスト比が求められる。要点は、デザインの配色を決める段階で必ずコントラスト比を確認する習慣を持つこと。特にブランドカラーをテキストやUIに使う際は、見た目の美しさとアクセシビリティの両立を意識した色選定が求められる。落とし穴は、デザインツール上の見た目では問題なく見えても実際の数値が基準を下回っているケースや、プレースホルダーテキストや非アクティブ状態の色など、見落としやすい箇所の確認不足。確認ツールはFigmaのプラグインやブラウザの開発者ツールでテキストと背景色のコントラスト比を簡単に測定・チェックすることができる。
クライアント向け説明
テキストと背景の「色の明暗の差」を数値で表したものです。この差が小さいと文字が読みにくくなり、特に視力の弱い方・高齢の方・屋外でスマートフォンをご覧の方にとって大きな障壁になります。ウェブアクセシビリティの国際的なガイドライン（WCAG）では、通常の文字に「4.5:1以上」のテキストと背景色のコントラスト比の数値基準が定められており、多くの国や企業でこの基準への準拠が求められています。「見た目がきれい」なだけでなく「誰でも読める」デザインを実現するための、重要な指標となります。
監修
yoneco
Makoto Koizumi (Zoomin)