メインコンテンツへスキップ
Toolars
探索
バグを報告

画像 · ローカルユーティリティ

画像カラー抽出

Image Color Extractor

画像から最大 12 個の RGB 色グループを抽出し、可視分析サンプルのアルファ加重比率順に表示。HEX のコピーや JSON のダウンロードができます。

タスクの道筋 / 入力から結果へ

画像を選択する

ローカルで実行 · アップロードなし

画像カラー抽出の使い方、プライバシー、関連ツール

タスクの道筋 / 入力から結果へ

画像からカラーパレットを抽出する方法

  1. 01

    画像を選択する

    「ファイルを選択」を選び、12 MiB までの PNG、JPEG、WebP を開きます。片側 8,192 ピクセル、合計 24,000,000 ピクセルまでです。ピクセルはローカルでデコードされ、アップロードはされません。

  2. 02

    パレットサイズを設定する

    「パレットの色数」スライダーで 1〜12 色を選びます。色数を少なくすれば広い要約に、多くすればアクセントカラーまで浮かび上がります。

  3. 03

    パレットを抽出する

    「パレットを抽出」を押します。デコード後の RGB 値を各チャンネル 16 段階の固定バケットに分け、完全に透明なピクセルを除外し、残りをアルファ値で重み付けします。バケットは可視分析サンプル内の重み付き比率で並びます。4,000,000 ピクセルを超える画像は縮小コピーを使うため、結果は元ファイルの厳密な集計ではありません。

  4. 04

    色をコピーまたはダウンロードする

    各スウォッチには HEX と、分析した可視サンプル内での概算比率が表示されます。クリックで HEX をコピーするか、hex、rgb、alpha、share を含む JSON をダウンロードできます。上位 1〜12 個のバケットだけを返すため、比率の合計が 100% になるとは限りません。

ツールの概要

処理
ブラウザー内で完結
入力の外部送信
なし
保存
一切保存しません
価格
無料

入力はブラウザに留まります。

画像カラー抽出 は検証済みのローカル実行パスを使用し、隠れた入力・出力履歴を作成しません。

ローカル実行

現在のブラウザタブ内で実行されます。

隠れた処理なし

使用中のツールデータが Toolars のドキュメントレコードになることはありません。

アカウント不要

プロフィールを作成せずにコアワークフローを使えます。お気に入りはログイン後にアカウントへ同期されます。

即時リセット

タブを閉じれば、作業中のデータは消えます。

画像カラー抽出 が実際に行うこと

ランディングページには商品写真から正直に採ったパレットが必要で、スライドテンプレートは表紙画像に寄せたい、デザイン監査では現在のインターフェースの dominant color が知りたい。画像カラー抽出はブラウザ内で分析した可視サンプルのアルファ加重比率順にパレットを並べます。ソース画像がどこにもアップロードすべきでない未公開デザインのとき、特に役立ちます。

よくある質問

色はどう選ばれ、並べられますか?
各ピクセルは RGB 各チャンネルの上位 4 ビットで固定バケットに分類されます。見た目が近い色でも別のバケットに分かれる場合があり、同じバケット内の色は平均化されます。透明ピクセルは除外し、半透明のピクセルはアルファ値で重み付けします。指定数までの上位バケットを返しますが、独立したデザインカラーとは限りません。
色はいくつ選ぶべきですか?
少なめから始めてください。1〜3 色は画像の雰囲気を要約し、5〜7 色なら写真の背景・被写体・アクセントをきれいに分けられます。12 色に近づけるのは、はっきり異なるフラットな色の多いアートワークだけにしてください。そうでなければ、余分なスウォッチが意味を保てず、1 つのグラデーションがほぼ同じ色の重複に分割されてしまいます。
エクストラクターは透過をどう扱いますか?
完全に透明なピクセルは計測から完全に除外され、半透明のピクセルは不透明度に比例してカウントされます。そのため、柔らかいエッジの切り抜きがパレットを見えない背景へ引きずることはありません。JSON ダウンロードの alpha フィールドは、各色の平均不透明度を報告します。
JSON ダウンロードのフィールドの意味は?
hex と rgb はバケットの平均 RGB を丸めた値、alpha は平均不透明度、share は分析した Canvas サンプルの可視ピクセル全体に対するアルファ加重比率です。元画像の厳密な面積比ではありません。上位バケットだけを書き出すため、share の合計が 100% 未満になることがあります。
パレットが近似的に見えるのはなぜですか?
固定 RGB バケットで画像を簡潔なパレットにしますが、見た目の近い色を必ず統合するわけではありません。境界を挟む近い色は分かれます。4,000,000 ピクセルを超える画像は分析前に再サンプリングされ、細部や順位が変わる場合があります。採用前に元画像と見比べてください。
画像はどこかにアップロードされますか?
いいえ。デコードと量子化は現在のブラウザタブ内だけで実行され、アカウントは不要です。ワークスペースをリセットすると、画像と抽出されたパレットは破棄されます。

画像スタジオを続ける

行き止まりではなく、関連タスクへ。

完全な索引に戻らずに、別のフォーカスされたワークスペースへ移動できます。

画像トリミング

Image Cropper

PNG・JPEG・WebP を正確なピクセル座標で、自由または固定のアスペクト比付きで切り抜き、PNG・JPEG・WebP として書き出す。

編集

画像フィルター

Image Filters

明るさ・コントラスト・彩度・グレースケール・セピア・ぼかしを 6 つのスライダーで調整し、元サイズの PNG でダウンロード。

編集

画像リサイズ

Image Resizer

画像をアスペクト比ロック付きの正確なピクセル寸法にリサイズ。1 枚ずつ、または最大 12 枚のバッチを ZIP でダウンロード。

編集

画像の平均色を抽出

Image Average Color Finder

画像の平均色を alpha 加重で測定し HEX・rgb()・rgba() でコピー。透明ピクセルは平均に混ざらず無視される。

確認