画像から配色抽出とは
写真やイラストをアップロードすると、その画像に多く含まれる主要な色を解析して、カラーパレット(HEX)を取り出せる無料ツールです。デザインの配色を決めるときの参考や、写真に合わせたテーマカラー選び、ムードボード作りなどに使えます。画像はブラウザ内だけで処理され、どこにも送信されません。
使い方
- 画像を選ぶ(ドラッグ&ドロップも可)
- 抽出する色数を選ぶ
- 色をタップしてHEXをコピー、またはCSS変数を出力する
抽出の仕組み
画像を縮小してから全体のピクセルの色を集め、メディアンカット法で色の空間を分割し、代表色を求めています。写真では、背景・被写体・光などの主要な色が抽出されます。抽出数を増やすと中間色まで細かく、減らすと大きな色の傾向がつかめます。単色に近い画像やベタ塗りのイラストでは、指定した数より少ない色数になることがあります。
よくある質問
画像はアップロードされますか?
いいえ。選んだ画像はお使いのブラウザ内だけで読み込まれ、サーバーには送信されません。
思った色が出ません
面積の大きい色が優先されます。抽出数を増やすと、少ない面積の色も出やすくなります。
CSSにそのまま使えますか?
「CSS変数を表示」で
--color-1 のような形式が出力されます。名前は用途に合わせて調整してください。無料・インストール不要のブラウザツール / 画像から配色抽出