完全無料
画像から カラーパレット を 抽出
画像から主要な色を即座に抽出します。HEXとRGBの値をワンクリックで取得できます。無料、安全、ブラウザ上で完結します。
画像をここにドラッグ＆ドロップ
PNG、JPG、WEBP、GIF対応。最大50MB。
または
画像から主要な色を即座に抽出します。HEXとRGBの値をワンクリックで取得できます。無料、安全、ブラウザ上で完結します。
PNG、JPG、WEBP、GIF対応。最大50MB。
カラー パレットの抽出では、画像を分析し、主要な色または代表的な色を特定します。その結果、画像の視覚的特徴を捉える小さな色のセット (通常は 5 ～ 8) が得られます。デザイナーは抽出したパレットを使用して、他のデザイン要素（ヒーローイメージを引き立てるUIカラー、写真から派生したブランドパレット、ムードイメージに合わせた配色）をコーディネートします。
抽出では、クラスタリング アルゴリズム (K 平均法など) を使用して、画像のすべてのピクセルを要求された数のカラー クラスターにグループ化します。各クラスターの中心がパレットの色になります。最大のクラスターは主要な色を表します。このアルゴリズムでは、生のピクセル数ではなく、視覚的な重要性 (彩度、コントラスト) によって重み付けして、表面の印象的なアクセント カラーを決定することもできます。
このツールは、JavaScript を使用してブラウザで実行されます。画像はピクセル データにデコードされ、計算量を減らすためにサンプリングされ、クラスタ化されます。出力は、16 進数コード、RGB 値、および画像内の各色の普及率を示す比例バーを含むパレットです。
既存の画像と調和する作品をデザインする場合、抽出したパレットを使用すると、目で色を選択するよりもはるかに速くなります。ヒーロー画像を中心にランディング ページを構築する Web デザイナー、主要な製品写真に一致するアセットを作成するマーケティング担当者、競合他社の画像を分析するブランド デザイナーはすべて、アルゴリズムによるパレット抽出の恩恵を受けています。
パレットはコンテンツ管理もサポートします。主要な色で画像を分類すると、ユーザーが写真、製品、デザインを色別に閲覧するインターフェイスを構築できます。このようなシステムを構築するには、パレットを体系的に抽出する必要があり、プログラムによる抽出が可能になります。
アップロードし、パレット サイズを選択し、色を取得します。
K 平均法クラスタリングは反復します。各ピクセルを最も近いクラスターの中心に割り当て、割り当てられたピクセルの平均として中心を再計算し、収束するまで繰り返します。フル解像度の画像での実行は遅くなります。サンプリング (N 番目のピクセルごとに取得) は、品質の低下を最小限に抑えながら高速化されます。
色空間は重要です。 RGB でのクラスタリングでは、RGB 距離によって重み付けされたパレットが生成されますが、これは知覚距離と一致しません。 LAB または HSV でクラスタリングすると、より知覚的に整列したパレットが生成され、似た色がより確実にグループ化されます。
出力: 各クラスター中心の 16 進コードと、各クラスター内の画像ピクセルのパーセンテージを加えたもの。パーセンテージは視覚的な普及率を表します。最大のクラスターが最も優勢な色です。