画像カラー抽出は、あらゆる画像ファイル（ドロップ、貼り付け、またはクリックで読み込み）を分析し、最大16色の主要な色をその割合と共に返します。ブラウザ内でのピクセルサンプリングとバケット量子化を使用しており、アップロードやサーバーとの通信は一切不要です。スウォッチをクリックして HEX をコピーするか、「すべてコピー」でパレット全体を取得できます。
デザイナーや開発者は、ロゴからブランドカラーを抽出したり、写真からパレットを作成したり、参考アートワークに UI を合わせたりするために、画像から色を抽出する必要が常にあります。画像カラー抽出は、アップロードなしでブラウザ内ですべて処理します。画像（PNG、JPG、SVG、WebP、GIF）をドロップ、貼り付け、またはクリックして読み込んでください。ツールは画像をキャンバスに縮小描画し、4ピクセルごとにサンプリングし、それらを縮小された色空間（チャンネルあたり5ビット、約32Kバケット）に分類します。各バケットの実際の RGB を平均化した後、類似色を統合（RGB のマンハッタン距離 24 以内）しながら出現頻度の高い上位 N 個 Hide バケットを選択します。その結果、単に「最も正確なピクセル一致」ではなく、実際の視覚的な構成を反映したクリーンで代表的なパレットが得られます。個数スライダー（3〜16）を使って、必要に応じてパレットサイズを調整できます。各スウォッチには HEX 値とピクセル割合が表示され、個別にクリックコピーすることも、パレット全体を一度にコピーすることも可能です。
あらゆる一般的な画像形式を読み込み、巨大な画像であっても1秒未満で主要なカラーパレットを生成します。
抽出された各色は、画像内での占有率（パーセンテージ）を表示します。どの色が主役で、どの色がアクセントであるかが一目でわかります。
スライダーを使って 3〜16 色の間で選択できます。ブランドワークには小さなパレット、写真の参考には大きなパレットを使い分けられます。
任意のスウォッチをクリックして HEX をコピーできます。また、「すべてコピー」を使えば、一括利用のために改行区切りのリストとしてパレット全体を取得できます。
アップロードもサーバー呼び出しもありません。画像がマシンから離れることはないため、非公開のモックアップや未発表のアセット、機密性の高いアートワークでも安全です。
PNG、JPG、SVG、WebP、GIF、ICO すべてを標準的な Canvas デコードでサポート。透明ピクセルは自動的にスキップされます。
ロゴ画像をドロップして使用されている正確な色を抽出し、ブランドキットの CSS 変数やデザインシステムにコピーします。
風景写真をツールに読み込ませて、その雰囲気を取り込んだ5色のパレットを取得します。アートディレクションやテーマ構築に役立ちます。
参考サイトのスクリーンショットを取り込み、抽出されたパレットを自身のモックアップに使用することで、視覚的な雰囲気を統一します。
クライアントからデザインの方向性として画像が送られてきた際、8〜10色を抽出して、リファレンスに忠実なスターターパレットを提案します。
画像から最も支配的な2色を取得し、前景のアセットを引き立てる背景グラデーションを構築します。
DevSuite Pro のドックにある画像カラーアイコンをクリックします。ドロップゾーンと設定があるパネルが開きます。
ファイルをドラッグ、クリップボードから貼り付け（Ctrl+V）、またはクリックしてファイルピッカーを開きます。ツールが自動的に画像を読み込み、ピクセルをサンプリングします。
スライダーを使用して抽出する色の数（3〜16）を選択します。ドラッグすると即座にパレットが再抽出されます。
各スウォッチに HEX コードと画像内での占有率が表示されます。主要な色は占有率が高くなります。
任意のスウォッチをクリックして HEX をコピーするか、「すべてコピー」を使用してパレット全体をリストとして取得し、デザインツールや CSS で使用します。
DevSuite Pro を無料でインストールして、ブラウザで 39 以上の開発者ツールを利用しましょう。
