chrome のデベロッパーブログ によると、Chrome v83 から内蔵の DevTools にて色覚異常のシミュレーションができるようになったようです。
この記事では色覚異常のシミュレーション操作方法を記載します。
手順
(1) Chrome の デベロッパーツールを開く
Chrome 内の「･･･」⇒「その他ツール」⇒「デベロッパーツール」から開けます。
(2) デベロッパーツールから Rendering 項目を表示する
デベロッパーツール内の「･･･」⇒「More Tools」⇒「Rendering」から表示できます。
(3) Emulate vision deficiencies からシミュレーション設定を行う
Rendering 内の 「Emulate vision deficiencies」からシミュレーションを選択できます。
シミュレーションの種類
| 選択肢 | サンプル | 内容 |
|---|---|---|
| ① No emulation |  |
シミュレーションなしの通常状態 |
| ② Blurred vision |  |
霧視、かすみ目 |
| ③ Protanopia |  |
1型2色覚。赤色光を知覚できない。 |
| ④ Deuteranopia |  |
先天赤緑異常：緑色の光を知覚できない。 |
| ⑤ Tritanopia |  |
三型色覚：青色光を知覚できない。 |
| ⑥ Achromatopsia |  |
色覚異常：灰色の色合いを除いて、どの色も知覚できない。 |