0

色覚異常シミュレーター

リニア RGB で適用された公開されている色覚異常変換行列を使用して、第 1 色覚、第 2 色覚、第 3 色覚、または色覚異常を持つ人が行うのと同じ方法で、写真、グラフ、またはスクリーンショットを表示します。

👁️

ここに画像をドラッグ&ドロップ

PNG、JPG、WebP をサポート

100%
Buy Me a Coffee at ko-fi.com
処理中... 0%
画像の読み込み中
リニアRGBへの変換
CVD変換の適用
完了

結果

Preview Output

およそ男性の 12 人に 1 人、女性の 200 人に 1 人が何らかの色覚異常を抱えていますが、ほとんどのグラフ、UI モックアップ、写真は典型的な色覚を持つ人々によってのみデザインおよびチェックされています。このツールを使用すると、任意の画像をアップロードして、第二色覚、第二色覚、三色覚、または色覚異常を持つ人が実際に見るのと同じように画像を表示できるため、混乱を招く赤/緑の凡例や判読できないステータス カラーを出荷前に見つけることができます。

このシミュレーションは、単純な彩度の低下や色相回転のフィルターではありません。第一色覚、第二色覚、および三色覚は、公開されている Machado、Oliveira & Fair (2009) の二色性変換行列 (生理学的錐体応答モデルから導出された実数 3x3 係数) を使用してシミュレーションされます。これは、専門的なアクセシビリティ ツールで使用される行列と同じファミリーです。これらの行列は線形光空間でのみ有効であるため、各ピクセルは最初に正確な区分的 sRGB 伝達関数 (フラットなガンマ 2.2 ショートカットではない) を使用して sRGB から線形 RGB に変換され、そこに行列が適用され、結果は表示およびエクスポートのために sRGB に逆変換されます。アクロマトプシア(完全な色盲)では、同じ線形空間に適用される標準 ITU-R BT.709 輝度重み(赤 0.2126、緑 0.7152、青 0.0722)が使用されます。これは、放送およびディスプレイ規格全体で使用される知覚される明るさの従来の定義です。

実際の色覚異常は、すべてか無かではありません。CVD 患者のほとんどは、影響を受けた錐体タイプに何らかの機能を保持しています。重大度スライダーは次のことを反映しています。0% では手つかずのオリジナルが表示され、100% では完全にシミュレートされた二色色または無彩色が表示され、その間のすべての値はピクセルごとに 2 つを線形にブレンドします。これにより、同じ種類の欠乏症の軽度、中等度、重度の症例を同じ画像上でプレビューすることが可能になります。

写真、グラフ、または UI スクリーンショットをドロップし、CVD タイプと重大度を選択して [実行] を押すと、キャンバス上にレンダリングされたオリジナルとシミュレートされた比較が表示されます。シミュレートされたバージョンを、画像の元の解像度の PNG としてダウンロードします。サーバーには何もアップロードされません。ファイルがデバイスから離れることはなく、パイプライン全体がブラウザー独自の Canvas 2D API および ImageData API を使用して実行されます。