アクセシビリティ
色覚シミュレーター - 配色と画像の見え方を確認
P型・D型・T型色覚と全色盲での配色や画像の見え方をシミュレーションし、色覚特性のある人が混同しやすい色の組み合わせを見つけます。
確認する色
一般色覚
多くの人に見えている色です。
P型(1型)色覚
2 組の色が混同される可能性があります赤を感じる錐体がない状態:赤は暗く、茶色やオリーブ色寄りに見えます。
- #2CA02C と #FF7F0E が似て見えます
- #1F77B4 と #9467BD が似て見えます
D型(2型)色覚
2 組の色が混同される可能性があります緑を感じる錐体がない状態:赤と緑の区別がつきにくくなります。
- #D62728 と #2CA02C が似て見えます
- #1F77B4 と #9467BD が似て見えます
T型(3型)色覚
すべての色を区別できます青を感じる錐体がない状態:青と緑、黄とピンクが混同しやすくなります。
全色盲
4 組の色が混同される可能性があります色覚がない状態:明るさの違いだけが残ります。
- #D62728 と #1F77B4 が似て見えます
- #D62728 と #9467BD が似て見えます
- #2CA02C と #9467BD が似て見えます
- #1F77B4 と #9467BD が似て見えます
Machado・Oliveira・Fernandes(2009)のモデルで最大強度をシミュレーションしています。より一般的な軽度の色覚特性では一般色覚に近く見えます。
使い方
日本では男性の約 20 人に 1 人、女性の約 500 人に 1 人が先天的な色覚特性を持つといわれます。配色を入力するか、スクリーンショットをアップロードすると、4 種類の色覚での見え方を確認できます。あなたには違って見えても、ある色覚ではほぼ同じに見える組み合わせも表示するので、グラフやステータス色、リンクの確認に役立ちます。
- 1 配色の色を入力するか画像をアップロードします。
- 2 色覚の種類ごとの見え方を比べます。
- 3 指摘された組み合わせは、色相だけでなく明度を変えて改善します。
よくある質問
どの色覚タイプをシミュレーションできますか?
P型(1型)、D型(2型)、T型(3型)色覚と全色盲です。赤と緑が区別しにくい P型・D型が大半を占めます。
シミュレーションの精度は?
広く引用されている Machado・Oliveira・Fernandes(2009)のモデルを最大強度で使っています。実際の見え方には個人差があり、軽度の色覚特性では一般色覚に近く見えます。
誰にでも区別しやすい配色にするには?
重要な色は色相だけでなく明度にも差をつけ、文字・アイコン・パターンを併用して、色だけに情報を頼らないようにします(WCAG 1.4.1)。
画像はアップロードされますか?
いいえ。画像はブラウザ内の Canvas API で処理され、端末の外に送信されません。