カラー設定（テキスト色 ＆ 背景色）
現在のコントラストを分析中...
コントラスト比（輝度比）
知覚コントラスト（Lc値）
すべてのユーザーに届く、境界なきWebデザイン。
色彩は感情を伝え、構造を語り、行動を促します。しかし、コントラストが不足していればそのメッセージは誰にも届きません。 最新のAPCA認知科学と色覚多様性シミュレーションで、美しさとアクセシビリティの両立を実現します。
👁️ 色覚多様性（カラーユニバーサルデザイン CUD）リアルタイムシミュレーション
Brettel / Machado数理モデルによる色覚特性別の見え方検証（男性の約20人に1人、女性の約500人に1人が該当）
3系統の錐体（赤・緑・青）がすべて標準的に機能している見え方。
L錐体（長波長/赤）が欠失または変位。赤が暗く見え、緑・茶色と混同しやすい。
M錐体（中波長/緑）が欠失または変位。日本人男性で最も多いタイプ（約3.5%）。
色相情報を持たず輝度差（明度）のみで視認する見え方。印刷時や直射日光下の端末にも該当。
🧩 実機UIコンポーネント 実装検証サンドボックス
ボタン・フォーム・アラートバッジ・カードでの視認性をリアルタイム確認
① ボタン・アクション要素
② フォーム入力欄
③ アラートバッジ ＆ ステータス
💻 デザイントークン ＆ CSS / Tailwind コード出力
プロジェクトにそのまま貼り付けて使用可能なトークンコードを生成
💡 WCAG 2.2 ＆ APCA・色覚多様性 よくある質問（FAQ）
Q. 従来のWCAG 2.x（4.5:1）と、次世代規格APCA（Lc値）の違いは何ですか？ ▼
従来のWCAG 2.xコントラスト比は、単なる2色の「相対輝度の割り算」であり、フォントの太さ（ウェイト）、フォントサイズ、および表示極性（白背景の黒文字 vs 黒背景の白文字）の違いを考慮していませんでした。その結果、「4.5:1を満たしているのに細いフォントで読みにくい」または「暗い背景で不自然に失格になる」といった問題が生じていました。
APCA（Advanced Perceptual Contrast Algorithm）は人間の視覚系・大脳皮質のコントラスト知覚モデルに基づいて開発された次世代基準です。極性による知覚差や文字サイズを正確に反映し、より自然で実用的なアクセシビリティ判定を可能にしています。
Q. 改正障害者差別解消法（2024年4月義務化）ではどの基準を満たす必要がありますか？ ▼
日本国内の公的調達や民間企業の合理的配慮基準としては、JIS X 8341-3:2016「高齢者・障害者等配慮設計指針」の適合レベルAA（WCAG 2.0/2.1/2.2のAAと同等）を満たすことが標準とされています。
具体的には、通常サイズの文字で4.5:1以上、大きな文字（18pt以上または14pt太字以上）およびUIパーツの境界線で3.0:1以上のコントラスト比を確保する必要があります。本ツールではこのJIS/WCAG基準と次世代APCA基準を同時に確認できます。
Q. 色覚多様性（CUD）に配慮する際、最も重要なポイントは何ですか？ ▼
「色だけで情報を伝えない（Color alone should not be used）」という原則です。例えば、エラーメッセージを「赤い文字だけ」で表示するのではなく、アイコン（⚠️）や下線、明確な文字テキスト（「必須項目です」）を併用することで、P型・D型などの赤緑混同色特性を持つユーザーでも確実に認識できます。