カラーコントラストチェッカー

このツールについて

前景色（テキスト）と背景色の組み合わせがWCAG 2.1のアクセシビリティコントラスト基準を満たしているかを確認します。コントラスト比を即座に計算し、AAおよびAAA基準への合否を表示します。

使い方

1. 前景色（テキスト）の16進数値を選択または入力します。
2. 背景色の16進数値を選択または入力します。
3. ライブプレビューと各WCAGレベルの合否結果を確認します。

主な用途

• デザインを公開する前に、テキストと背景色の組み合わせがアクセシビリティガイドラインを満たしているか確認する
• ボタン、リンク、本文テキスト向けに読みやすい配色を選ぶ
• 既存のウェブサイトやアプリのアクセシビリティ準拠状況を監査する

使いこなすヒント

• AA（4.5:1）は、ほとんどのウェブサイトが通常テキストで満たすべき最低基準です。
• 大きいテキスト（18pt以上、または太字14pt以上）は低いコントラストでも読みやすいため、必要な比率が低く設定されています。