画像から色を抽出

画像で実際に多く使われている色を取り出し、占める割合とともに表示して、16進値や CSS 変数として持ち出せます。

ブラウザ内だけで処理無料で利用

ファイルをドラッグするか、クリックして選んでください

ファイルはサーバーに送信されず、ブラウザ内だけで処理されます。

使い方

登録もインストールも不要、回数制限もなく無料で使えます。

写真や画面の切り抜きを入れると、その絵を実際に覆っている色が割合つきで出ます。

色は数える前にまとめます。写真1枚にはわずかに違う値が数千種類あり、値のまま数えると目には同じに見える色調が10個並びます。

各色はその塊に入った画素の平均であって、塊の中心ではありません。中心を使うと絵に無い色が出て、絵の隣に置いた瞬間にずれて見えます。

近い塊どうしは合わせ、割合も足します。境目でふたつに割れた色が順位から落ちないようにするためです。

透明な画素は飛ばします。背景が透ける場所に数える色は無く、含めると結果が下地の色へ引っ張られます。

割合ではなく明度で並べ替えるのは、アクセント色をいくつか選ぶときではなく段階的な色を作るときに役立ちます。

画像がアップロードされることはありません。画素はブラウザの中で読み取ります。