ガイド

画像から主要な色とカラーパレットを抽出する方法

画像データを指定して実行すると、主要な色のカラーパレットと各色の基本情報を確認できます。色数を指定しない場合は5色、指定しても結果は最大10色です。

ツール 画像カラーピッカー

画像の主要色を調べる

画像に含まれる色の傾向を確認したいときは、画像データを指定すると、主要な色からカラーパレットを作成できます。各色についてRGB値、16進数表記、該当ピクセル数、割合を確認できるため、配色の検討や画像の色構成の把握に役立ちます。画像全体については、数えた色の種類と元画像の寸法も表示されます。

使い方の手順

  1. 画像データを入力します。画像データは省略可能な入力ですが、空のままでは処理に失敗するため、解析する画像を指定してください。
  2. 抽出したい色の数を指定します。色数を指定しない場合は5色が使われます。指定する場合も、結果として選ばれる色は最大10色です。
  3. 実行して結果を確認します。入力された画像は解析前に150×150ピクセルへリサイズされ、RGB形式に変換されます。その後、リサイズ後のピクセルを数え、出現数の多い色から指定数に応じて選択します。
  4. 各色のRGB値、16進数表記、ピクセル数、割合を確認します。あわせて、数えた色の種類と元画像の幅・高さも確認してください。

結果の見方と注意点

結果の一覧は、画像内で出現数の多い色を上位から確認するためのものです。RGB値は3つの数値、16進数表記は小文字の形式で示され、ピクセル数と割合によって各色の構成比を見比べられます。表示される色の数は指定した色数に従いますが、最大10色です。

色の集計対象は元画像そのものではありません。150×150ピクセルへリサイズし、RGBに変換した後のピクセルが数えられるため、元画像の細部やアルファチャンネルの状態がそのまま結果に反映されるとは限りません。一方、画像の寸法として表示されるのは元画像のサイズです。画像データがない場合、読み込みや画像処理で例外が起きた場合、または画像処理に必要な機能を利用できない場合は、成功したパレット結果になりません。

使用例

ウェブページ用の画像で目立つ色を3色に絞って確認したい場合です。

配色を確認したい画像データを入力し、色数として3を指定して実行します。

選択された色ごとにRGB値、16進数表記、ピクセル数、割合が並び、別途、数えた色の種類と元画像の幅・高さが表示されます。

制限事項

  • 色の集計は150×150ピクセルへリサイズしてRGBに変換した後に行われるため、元画像の細部やアルファチャンネルがそのまま反映されるとは限りません。画像データがない場合や読み込み・処理に失敗した場合は、パレット結果になりません。

よくある間違い

  • 画像データを指定せずに実行すると処理に失敗します。空欄のままにせず、解析対象の画像データを入力してから再実行してください。

よくある質問

画像を入力しなくても色を抽出できますか?

画像データを指定しない場合は処理に失敗します。解析する画像データを入力してください。

抽出する色の数は変更できますか?

色数を指定しない場合は5色です。指定した場合も、選択される色は最大10色に制限されます。

元画像のピクセルをそのまま集計しますか?

元画像のサイズは概要として表示されますが、色の集計は画像を150×150ピクセルへリサイズし、RGBに変換した後に行われます。

ツール

画像カラーピッカー