科学 figure アクセシビリティキット
Okabe-Ito の色覚バリアフリーパレット。正確な HEX・RGB・CMYK 値を掲載し、CSS、matplotlib、R、JSON、CSV、SVG のコードとしてそのままコピーできます。スウォッチをクリックすると HEX をコピーします。すべてブラウザ内で生成され、登録は不要、アップロードもありません。
:root {
--oi-black: #000000;
--oi-orange: #E69F00;
--oi-sky-blue: #56B4E9;
--oi-bluish-green: #009E73;
--oi-yellow: #F0E442;
--oi-blue: #0072B2;
--oi-vermillion: #D55E00;
--oi-reddish-purple: #CC79A7;
}
| 名称 | HEX | RGB | CMYK |
|---|---|---|---|
| 黒 | #000000 | 0, 0, 0 | 0, 0, 0, 100 |
| オレンジ | #E69F00 | 230, 159, 0 | 0, 50, 100, 0 |
| スカイブルー | #56B4E9 | 86, 180, 233 | 80, 0, 0, 0 |
| 青緑 | #009E73 | 0, 158, 115 | 97, 0, 75, 0 |
| 黄 | #F0E442 | 240, 228, 66 | 10, 5, 90, 0 |
| 青 | #0072B2 | 0, 114, 178 | 100, 50, 0, 0 |
| 朱色 | #D55E00 | 213, 94, 0 | 0, 80, 100, 0 |
| 赤紫 | #CC79A7 | 204, 121, 167 | 10, 70, 0, 0 |
CMYK 値は Okabe と Ito 自身が発表した数値で、単一の忠実な複製(NYU Siegal Lab)から転記したものです。RGB と HEX は複数の独立した出典で確認済みです。正確な色が重要な場合は、CMYK をご自身の印刷ワークフローで検証してください。
Okabe-Ito パレットについて
このパレットは Masataka Okabe と Kei Ito が Color Universal Design のために作成しました。8色(黒に加えて7つの有彩色)からなり、黄緑の混同域を避け、明度と彩度を変えることで、一般的な色覚特性のもとでも区別できるよう経験的に選ばれています。数学的に保証されたものではなく経験的に色覚多様性に対応しており、Bang Wong の 2011 年 Nature Methods のコラムがその7色サブセットを広めましたが、彼が考案者というわけではありません。
うまく使うには
- カテゴリが4つ以下なら、オレンジ、スカイブルー、青、朱色から始めてください。CVD シミュレーションで対比が最も高い4色です。
- 色だけに頼らないこと。異なる線種、マーカー、テクスチャと組み合わせ、グレースケール印刷でも figure が判別できるようにしてください。
- 赤と緑を一緒に使うのは避け、白地で消えてしまう細い線や小さな文字に黄色を使わないでください。
よくある質問
Okabe-Ito パレットは無料で使えますか?
はい。このパレットは Color Universal Design の一部としてオープンな利用向けに公開されており、多くの科学スタイルガイドで採用されています。ここで提供するダウンロードファイルは、figure やコードにそのまま組み込めるよう用意しています。
本当に色覚多様性に対応していますか?
第二色覚(deuteranopia)、第一色覚(protanopia)、第三色覚(tritanopia)のもとでも区別できるよう経験的に設計されており、科学分野で最も広く推奨される既定です。数学的な保証ではないため、色のみによるエンコードは避け、CVD シミュレーターで figure をテストしてください。
どのフォーマットをダウンロードすべきですか?
Web の figure には CSS、作図コードには matplotlib または R、他ツールへの取り込みには CSV または JSON、既製のスウォッチ帯には SVG を使ってください。すべて同じ8色の検証済みカラーを含みます。
CMYK 値は印刷に信頼できますか?
これらは Okabe と Ito 自身が発表した CMYK 値ですが、単一の複製から転記したものなので、色が重要な場合はご自身の印刷ワークフローで確認してください。RGB と HEX の値は複数の独立した出典で確認済みです。
figure に色覚多様性対応の配色を適用する完全ガイドが必要ですか?
Okabe-Ito リファレンスガイドを読む