WCAGコントラストチェッカー
テキストと背景色の組み合わせがAA および AAA のアクセシビリティレベルを満たしているかを確認します。
2つの色のコントラストを確認する方法
テキストと背景の色を選択する
HEXコードを入力するか、ビジュアルセレクターを使用して両方の色を選択します。
コントラスト比を確認する
選択した背景上のテキストプレビューと共に、計算されたコントラスト比が即座に表示されます。
WCAG AA または AAA に準拠しているか確認
ツールは、通常テキストと大型テキストの両方について、各レベルでその組み合わせが適切であるかを示します。
色コントラストに関するよくある質問
テキストと背景の適切なコントラストは、視力が低い方を含め、すべての人がコンテンツを読むために不可欠です。PDFDocks は WCAG 標準に基づいて正確なコントラスト比を計算します。
AAとAAAはどういう意味ですか?
+
WCAGアクセシビリティガイドラインの2つの適合レベルです。AAは推奨される最小レベル、AAAはより厳しいレベルです。
どのくらいのコントラスト比が必要ですか?
+
通常のテキストは最小4.5:1（AA）または7:1（AAA）を推奨します。大きいテキストは3:1（AA）または4.5:1（AAA）です。
コントラストが重要な理由は何ですか?
+
コントラストが不十分だと、特に視力が低い人や周囲の光が強い画面では読みにくくなります。
プログラムをインストールする必要がありますか？
+
いいえ、何もインストールする必要はありません。ブラウザから直接使用できます。
無料ですか？
+
はい、このツールは完全に無料です。
ウェブサイト全体のデザイン確認に使えますか？
+
特定の色の組み合わせを確認できます。ウェブサイト全体を監査する場合は、使用しているテキストと背景のすべての組み合わせを確認する必要があります。
色
カラーコンバーター（HEX、RGB、HSL、CMYK）
HEX、RGB、HSL、CMYKの間で任意の色を瞬時に変換でき、ライブプレビューと最も近い色名を表示します。
カラーパレットジェネレータ
ベースカラーから5色の調和したパレット（補色、類似色、三色配色、単色配色）を作成します。
CSSグラデーションジェネレーター
最大4色の線形または放射状グラデーションを作成し、すぐに使用できるCSSコードをコピーします。
ランダムカラー
クリック1つでランダムに色を生成し、その名前、HEX/RGB/HSLコード、および類似色を発見できます。
カラーピッカー（スポイト）
ブラウザのスポイトツールを使用して画面から任意の色を選択するか、クラシックなカラーピッカーを使用します。
色盲シミュレーター
画像をアップロードして、一色型色覚異常、二色型色覚異常、または三色型色覚異常の人がどのように見えるかを確認します。
メッシュグラデーションジェネレーター
メッシュグラデーション（ぼかされた色のパッチ）で背景を作成し、PNGでダウンロードするか、CSSコードをコピーします。
色合いと陰影ジェネレーター
任意の色のより明るい色合いと最も暗い陰影をHEXコード付きで自動生成します。
カラーミキサー
2つの色を混ぜて、HEXコード付きで段階的に中間色を発見します。
カラーホイール（調和）
ホイール上で色を選択して、調和のとれた組み合わせを発見してください：補色、類似色、三色配置など。
画像からのパレット抽出ツール
画像をアップロードすると、その支配的な色を自動的に抽出し、各色のHEXコード付きのパレットを生成します。
画像の平均色
画像をアップロードして、HEX、RGB、HSLコード付きの平均色を瞬時に計算します。
