色覚シミュレーター
P型・D型・T型など 8 種類の色覚で画像・スクリーンショット・配色の見え方をブラウザ内で確認。原寸の PNG 保存と、見分けにくい色の組の判定に対応。画像はアップロードしません。
- ブラウザ内で処理
- データはブラウザ外に出ません
- 無料 · 登録不要
WeChat でスキャンしてシェア
例・詳しい説明・よくある質問 実際の出力つきの例、ほかのツールとの違い、よくある質問。
例：CUD 推奨配色セットと純色の赤・緑
カラーユニバーサルデザイン推奨配色セット ガイドブック（第2版、ver.4）の画面用アクセントカラーは、赤 #FF4B00、緑 #03AF7A、青 #005AFF、黄色 #FFF100 です。純色の #FF0000・#008000・#0000FF・#FFFF00 と並べて「色」タブに入れると、赤と緑の組は次のようになります。
| 色覚 | 推奨配色セット | 純色 |
|---|---|---|
| 1型2色覚（P型強度） | ΔEOK 0.166、1.85:1 | ΔEOK 0.068、1.33:1 |
| 2型2色覚（D型強度） | ΔEOK 0.112、1.08:1 | ΔEOK 0.133、1.69:1 |
| 1色覚 | ΔEOK 0.046、1.19:1（見分けにくい） | — |
P型強度では推奨セットの赤（#837200 に見える）と緑（#ACA177）の差は純色の 2 倍以上あります。純色の赤 #FF0000 は #6D5F00 の暗い色になり、緑と近づきます。一方、D型強度では純色の組のほうが離れています。白黒で印刷すると推奨セットの赤と緑は明るさがほぼ同じです。ガイドブック第3版の Q4 も、セット内のどの色を組み合わせても同じように見分けやすいわけではないと答えています。配色を決めたら、実際に使う色の組をここで確かめてください。
CUD 認証との関係
CUDO の CUD 検証は、C型・P型・D型など 3 タイプ以上の色覚の検証協力者が、実際に使われる環境で印刷物や製品を確認するものです。合格すると CUD マークを表示できます。シミュレーターの結果で認証は取れません。入稿前や検証の前に、色だけで区別している箇所を見つけて直す用途に使ってください。CUDO も色覚シミュレーションツールを「見分けにくい色」を知る手段として紹介しています。
計算方法と判定
各ピクセルを sRGB から線形光に変換し、Machado ほか（2009）の 3×3 行列を掛け、0〜1 に収めて sRGB に戻します。配色の判定は、シミュレーション後の 2 色の OKLab 上の距離（ΔEOK）とコントラスト比で行います。
- 0.02 未満は「同じに見える」。CSS Color 4 が色域マッピングで使う弁別閾です。
- 0.06 未満は「見分けにくい」。Szafir（2018）は散布図の点では実験室のモデルの約 3 倍の差が必要だったと報告しており、その 3 倍を取っています。
- 0.06 以上は「見分けられる」。
どのくらいの人が該当するか
日本眼科学会によると、先天色覚異常は日本人男性の約 5%、女性の約 0.2% で、大半が 1型と 2型です。3型と 1色覚はまれです。タイプ別の割合は欧米の集団での値が多く、Webvision では男性で 2型3色覚 5%、2型2色覚 1.5%、1型3色覚と 1型2色覚がそれぞれ 1%、女性では 2型3色覚 0.4%、ほかは 0.01% 程度です。
他のツールとの違い
2026 年 10 月 2 日に、Bing で「色覚シミュレーション」の 1 位だった Toolpods の色覚シミュレーターを確認しました。画像はブラウザ内で処理しますが、表示は 1 タイプずつで、異常3色覚と程度の設定、保存機能はありません。SVG フィルター（color-interpolation-filters=“sRGB”）で 1型に 0.567・0.433・0／0.558・0.442・0／0・0.242・0.758 という行列を使っており、Machado（2009）の行列ではありません。この行列を sRGB 値に掛けると、推奨配色セットの緑 #03AF7A は rgb(77, 79, 135) の青みがかった灰色、赤 #FF4B00 は rgb(177, 175, 18) になります。Machado モデルではそれぞれ #ACA177 と #837200 です。
Chrome のデベロッパーツール（Rendering パネルの Emulate vision deficiencies）は Machado の行列を使いますが、画面の色空間で計算します。Display P3 の画面の Mac（Chrome 152）では #2CA02C の 3型が rgb(32, 155, 136) になり、このツールの sRGB での計算 rgb(0, 155, 137) と違いました。
制限
- 平均的な観察者のモデルです。当事者による確認の代わりにはなりません。
- sRGB の外の色（Display P3 の写真など）はシミュレーション前に sRGB に切り詰めます。ブラウザが Display P3 で画像を読めるときは、その割合を表示します。
- 16,777,216 ピクセルを超える画像は縮小して処理します。HEIC・TIFF はデコードできるブラウザ（Safari）でのみ開けます。
- 「色」タブで確認できるのは 12 色までで、透明度は無視します。
- スマートフォンでは画面のキャプチャは使えません。スクリーンショットを撮って開くか貼り付けてください。
文字色のコントラストはコントラストチェッカー、スクリーンショットからの色の取得はスポイト カラーピッカーで確認できます。
FAQ
シミュレーションはどの程度正確ですか？
1型・2型・3型には Machado・Oliveira・Fernandes（2009）が発表した行列を使い、sRGB を線形光に変換してから計算します。Chrome のデベロッパーツールは 1型・2型・3型の 2色覚のモードにだけ同じ論文の程度 1.0 の行列（小数第 3 位まで）を使い、異常3色覚のモードはありません。1色覚は Rec. 709 の輝度、弱度の 1色覚は公開されたモデルがないため元の色との半々の混合です。平均的な見え方の推定であり、個人の見え方そのものではありません。
画像はアップロードされますか？
されません。読み込み・計算・PNG の作成はこのタブの中で行い、画像や色を含む通信はしません。保存するのは表示モード・表示方法・比較するタイプ・程度の設定だけです。ページの統計が記録するのはツール名と操作（画像を開く、サンプルのグラフ、画面をキャプチャ、ダウンロード、色の入力が 1.5 秒止まったときの 1 回）だけです。
P型・D型と 1型・2型はどう対応していますか？
日本眼科学会の用語では、赤を感じる L 錐体に関わるものを 1型、緑の M 錐体を 2型、青の S 錐体を 3型と呼び、程度により 2色覚と異常3色覚に分けます。カラーユニバーサルデザイン機構（CUDO）などが使う P型・D型・T型はそれぞれ 1型・2型・3型に当たり、強度・弱度はおおむね 2色覚・異常3色覚に対応します。ツールのカードには両方の名前を表示しています。
程度のスライダーは何を変えますか？
異常3色覚（1型3色覚・2型3色覚・3型3色覚）の程度を 0.1〜0.9 の 0.1 刻みで変えます。3型3色覚は画面上では「3型（弱度）」と表示します。初期値は 0.6 です。2色覚のタイプは常に 1.0 で計算します。
どのくらい大きな画像まで扱えますか？
16,777,216 ピクセルまでは元のサイズのまま処理します。これは現在の主要なブラウザがすべて受け付けるキャンバスの上限です。それを超える画像は縦横比を保って縮小し、そのことを表示します。カードに出るのは縮小したプレビューで、PNG を保存するときは処理サイズのまま分割して計算するため、その間もページを操作できます。