Dataviz Color Generator — データ可視化のための配色ツール

ブランド配色のツールは「その色がきれいか」を扱いますが、データ可視化で本当に困るのは別のところです。7本の折れ線を見分けられるか、色覚特性のある人にも同じ区別がつくか、2pxの細い線や8pxの小さな点にしても色が飛ばないか。この配色ツールは、そうした「エンコーディングが壊れていないか」を計算で判定することに絞って開発しています。

考え方はシンプルで、判定が主役、生成は脇役です。生成は「検証を通った候補」だけを提案し、判定は WARN / FAIL を出したうえで、どのペアが・どの視覚型で・どれだけ足りないかまで名指しします。「なんとなく良さそう」という表示はしません。

2つの画面

• Generator — テーマ（例: 海面温度の高低）から配色の型を推定し、検証済みの候補をまとめて出す。基準色をリングから自分で決めることも、有名なカラースキームから始めることもできる。
• Doctor — 手持ちの hex を貼り付けると、5検査 × light/dark で採点し、落ちたペアと不足量を具体的に指摘。単色の差し替えで PASS まで持っていく修正案も出す。

判定の中身

• 色の区別: OKLab の色差 ΔE で最悪ペアを測り、識別下限を満たすか
• 色覚特性（CVD）: protan / deutan / tritan を Machado–Oliveira–Fernandes 2009 でシミュレートし、変換後の ΔE を再判定
• 明るさ・コントラスト: WCAG コントラストと明度帯を、light と dark で独立にチェック（片方から自動反転しない）
• 実マークで確認: 大きな色見本ではなく、折れ線・点・ノード・棒・積み棒・面といった実際のマークで見え方を確認する

配色の型は、連続・発散・環状・カテゴリの4種類を想定しています。参考スキームは d3 / ColorBrewer / matplotlib をビルド時に取り込み、実行時に外部へ通信しません。状態はすべて URL に持たせる設計で、判定結果をリンクとして受け渡せるようにしています。

現在も開発中で、判定のしきい値や生成の質を調整しながら、実際の制作でどこまで使えるかを試しています。公開の形が固まったら、あらためてお知らせする予定です。