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

何をするのか

低コントラストのテキストは、Web 上で最も一般的なアクセシビリティの問題です。テキストと背景の色を入力すると、通常のテキスト、大きなテキスト、UI コンポーネントの正確なコントラスト比と合否判定が得られます。

テキストのコントラスト比を測定し、通常のテキストと大きなテキストの AA/AAA 準拠を確認します。

使い方

WCAG コントラスト チェッカー の使用方法の短いバージョンを次に示します。

• テキストと背景を設定する — カラー入力を使用するか、デザイン トークンから hex 値を貼り付けます。
• 比率を読む — このツールは、相対輝度とコントラスト比を小数点第 2 位まで計算します。
• 修正して再テストする — ペアが失敗した場合は、合格するまで明度を調整し、その後、準拠する hex 値をコピーします。

重要な機能

WCAG コントラスト チェッカー が得意とすること。

• デバイスからは何も残らない — 作業はブラウザのタブで行われます。このアプリにはアップロード エンドポイントがないため、ファイルやテキストを保存したり、ログに記録したり、当社が閲覧したりすることはできません。
• アップロードの待ち時間なし — サーバーへの往復を完全にスキップします。結果は、ネットワーク速度やキュー サイズではなく、ご使用の CPU によって制限されます。
• 無料、アカウントなし、割り当てなし — サインアップの壁、ウォーターマーク、1 日あたりの制限はありません。オプションのアカウントは、デバイス間でお気に入りとプリセットを保存するためにのみ存在します。