画像から色抽出

画像からの色抽出とは、写真やロゴ、スクリーンショットのピクセル分布を解析し、そこに使われている代表的な色をパレットとして取り出す手法です。ロゴのブランドカラーを特定したり、写真の雰囲気に合わせたUI配色を決めたりする際によく使われます。toco.toolsの画像から色抽出は、抽出したい色数を指定するだけで、ブラウザ内で完結して主要色のHEXと占有率を計算します。 内部ではメディアンカット法という決定論的な量子化アルゴリズムを使っています。まず画像の全ピクセルが収まる1つの箱（R・G・B値の範囲）を用意し、その箱の中でR・G・Bのうち最もばらつきが大きいチャンネルを選んで、その値の範囲の中央で2つの箱に分割します。これを指定した色数になるまで繰り返し、最後に各箱に含まれるピクセルの平均色を代表色として採用します。k-meansのような乱数の初期値に依存する手法とは異なり、同じ画像・同じ色数を指定すれば常に同じ結果になります。 このツールが単なる「よく使われている色のリスト」ではなく「占有率」を前面に出しているのは、面積比が実用上とても重要だからです。画像の40%を占める色はおそらくそのデザインの主役（背景色やブランドカラー）であり、2%しか占めない色は装飾やノイズである可能性が高いといえます。占有率のバーを見ながら、上位の色から順にブランドカラーの候補として検討するのが実践的な使い方です。なお、JPEGの圧縮ノイズやグラデーションが多い画像では、本来1色であるはずの領域が微妙に異なる色として分かれて抽出されることがあるため、最終的なパレットは目視でも確認することをおすすめします。