KOENJP

画像から色を抽出（カラーパレット・スポイト）

COLOR · PALETTE

画像からメインの配色パレットを抽出し、スポイトで好きな位置の色も取得。HEXカラーをCSS変数・SCSS・JSONで書き出せます。画像はアップロードされません。

ここに画像をドロップ
画像をクリックするとスポイトで色を取得できます
ファイルはアップロードされません・分析はすべてブラウザ内で行います
PALETTE 色をクリックするとHEXをコピーします
HOW TO

使い方

  1. 画像をアップロード・ドロップ・貼り付けするか、サンプル画像から始めます。
  2. 抽出する色の数（5〜10）と、K平均法かメディアンカットかを選びます。
  3. パレットの色をクリックするとHEXをコピー、画像をクリックするとスポイトで好きな位置の色を取得できます。
  4. EXPORTでCSS・SCSS・JSONを選び、変数名を変えてコードをコピーします。
PAIRS WELL WITH

あわせて使いたいツール

FAQ

よくある質問

K平均法とメディアンカットの違いは？

K平均法は似た色をまとめて代表色を見つけるので、写真に向いています。メディアンカットは色空間を半分ずつ分けてまんべんなく抽出するので、イラストや色のはっきりした画像に向いています。両方試して好みのパレットを選んでください。

抽出した色をCSS変数として使えますか？

はい。EXPORTでCSSを選ぶと、番号付きのCSS変数としてまとめて書き出せます。変数名は自由に変えられ、SCSS変数やJSONでも書き出せます。

画像はアップロードされますか？

いいえ。色の分析はすべてブラウザ内で行われ、画像がどこかに送信されることはありません。