パレットジェネレーター

画像からのカラーパレット抽出は、画像のピクセルデータを分析して視覚的に最も重要な色を特定します。処理は画像からピクセルをサンプリングすることから始まります（すべてのピクセルではなく、パフォーマンスのために代表的なサブセット）。各ピクセルのRGB値はユニークな色の数を減らすために量子化されます — 写真には微妙に異なる数百万の色が含まれる可能性があるため、これは必要です。量子化された色はカラーヒストグラムを構築するためにカウントされ、最も頻出する色がパレットとして選択されます。

当社のツールはパレット抽出にメディアンカット量子化アルゴリズムを使用します。アルゴリズムは色空間を再帰的に分割して動作します：値の範囲が最も大きい次元（R、G、またはB）を見つけ、その次元に沿ってピクセルをソートし、中央値で分割します。このプロセスは目的の色数に達するまで繰り返されます。結果は画像の最も明確な色領域を表す色のセットです。各色の頻度がパレット内の順序を決定します — 最も支配的な色が最初に表示されます。

生成されたパレット（画像から抽出されていない）の場合、ツールはカラーホイールに基づく色調和ルールを使用します。補色：カラーホイールの反対側にある2色（180°離れた色）。類似色：ホイール上で隣接する3色（30°離れた色）。トリアド：等間隔に配置された3色（120°離れた色）。テトラード：ホイール上で長方形を形成する4色。スプリットコンプリメンタリー：ベースカラーとその補色の両隣の2色。これらのルールは、色がカラーホイール上で数学的な関係を共有するため、視覚的に調和のとれた組み合わせを生み出します。

典型的なデザインパレットには5色が含まれます：プライマリ（ドミナント）、セカンダリ（サポート）、アクセント（コールトゥアクション用）、2つのニュートラル（ライトとダーク）。60-30-10ルールは60%ドミナントカラー、30%セカンダリ、10%アクセントの使用を推奨しています。私たちのツールは色彩理論の調和ルールを使用してパレットを生成します。

抽出したパレットをWebデザインに使用する場合、テキストと背景色のコントラスト比を常にテストしてください。スウォッチとして美しく見えるパレットでも、テキストに使用するとWCAGアクセシビリティ基準を満たさない場合があります。背景には明るい色、テキストには暗い色を使用してください。パレットの色がコントラスト要件を満たさない場合は、要件を満たすまで暗くまたは明るくしてください — 色相は同じままであるため、パレットの調和は保たれます。