色をクリックで HEX をコピー
画像をここにドロップ
クリックして選択 · または貼り付け (Ctrl/Cmd + V)
ブラウザ内で処理 · アップロードなし
写真・イラスト・参考画像から「使われている色(配色パレット)」を取り出すツールです。画像を読み込むと、median cut という量子化アルゴリズムで代表色を N 色に縮約し、各色の HEX コード・RGB 値・おおよその面積比(その色がどれくらいの面積を占めるか)を一覧表示します。色見本をクリックすればその HEX がクリップボードにコピーされ、「全 HEX をコピー」で改行区切りのリストとしてまとめて取得できます。パレットは .gpl(GIMP パレット形式。Krita・Inkscape・Photoshop など多くのソフトが読み込めます)や、各色を横に並べた PNG ストリップとして保存できるので、デザインカンプ・スライド・配色資料へそのまま流用できます。色数スライダーを動かすと画像を読み直すことなく即座に 2〜16 色へ再抽出されるので、「主要 3 色だけ欲しい」「もっと細かく 12 色見たい」を行き来できます。アルゴリズムは乱数を使わない決定論的な手法なので、同じ画像・同じ色数なら毎回同じパレットが出ます。透明な画素は集計から除外するため、切り抜き素材でも背景の透明部分に引っ張られません。あなたの画像は作品やリサーチ資料そのものなので、本ツールはどこにもアップロードせず、読み込みから抽出・コピー・保存まですべて端末内(ブラウザ)で完結します。
使い方
- 配色を抽出したい画像をドロップ(またはクリックで選択・Ctrl/Cmd+V で貼り付け)します。
- 色数スライダー(2〜16 色)で取り出す色の数を調整します。画像を読み直さずに即再抽出されます。
- 色見本をクリックして HEX をコピー、または「全 HEX をコピー」「.gpl を保存」「PNG を保存」でパレットを書き出します。
よくある質問
画像はサーバーにアップロードされますか?
いいえ。画像の読み込み・色の抽出・パレットの保存はすべてブラウザ内で行われ、どこにもアップロード・保存・送信されません。あなたの端末内だけで処理されます。
面積比(%)は何を表していますか?
その代表色のグループに分類された画素が、抽出に使った画素全体に占めるおおよその割合です。大きいほど画像の中で広い面積を占める色=主要色だと考えられます。処理を速くするため大きな画像は内部で間引いてから集計するので、厳密なピクセル数ではなく目安の比率です。
色数を変えると結果はどう変わりますか?
色数を増やすほど、似た色がさらに細かく分かれて中間色やアクセント色も拾えます。減らすと主要なテーマカラーだけに集約されます。スライダーを動かすと画像を読み直さずに即座に再抽出されるので、用途に合う粒度を探せます。
.gpl ファイルは何に使えますか?
.gpl は GIMP のパレット形式で、Krita・Inkscape をはじめ多くのソフトがそのまま読み込めます。保存してお使いのソフトのパレットフォルダに入れれば、抽出した配色をスウォッチとして使い回せます。HEX を直接コピーして CSS やデザインツールに貼り付けることもできます。
透明な部分がある画像でも使えますか?
はい。ほぼ透明な画素は集計から除外するので、切り抜き素材(透過 PNG)でも背景の透明部分に色が引っ張られません。被写体の色だけからパレットを作れます。
同じ画像なら毎回同じパレットになりますか?
はい。乱数を使わない決定論的なアルゴリズム(median cut)なので、同じ画像・同じ色数であれば毎回同じ代表色が得られます。