カラーミキサー

開始色から終了色まで最大 10 ステップでブレンド — グラデーションをプレビューし、あらゆるシェードを取得して任意のフォーマットを即座にコピーできます。

開始色

終了色

ステップ数

生成する中間シェードの数（1〜10）。

ブレンドモード

RGB HSL

グラデーション

ミックスパレット

2 色とステップ数を選ぶと、その間のすべてのシェードがブラウザで即座に計算されます。

カラーミキサーについて

カラーミキサーは2つの色を混ぜ合わせ、その間のすべてのステップを表示します。開始色と終了色を選び、中間の色数を最大10色まで指定すると、ツールは個々のスウォッチと滑らかなグラデーションプレビューの両方として、遷移全体を即座に計算します。

2つのブレンドモードが混合方法を制御します。RGBは各チャンネルを直線的に補間するため予測しやすくニュートラルな結果になり、HSLはカラーホイールを回るように補間するため、中間ステップがより彩度が高く鮮やかに保たれます。2つの端点を入れ替えたり、ランダムな色にしたりするのもワンクリックです。

すべての混合処理はブラウザ内で行われ、サーバーは一切関与しません。「青とオレンジの中間の色は何色か」といった質問に答えたり、チャート用の段階的なカラーランプを作成したり、2つのブランドカラー間のCSSグラデーションを取得したりするのに便利なツールです。

はい。色の混合は無料かつ無制限で、ツールはアカウントもクレジットもサーバー処理も必要とせず、完全にブラウザ内で動作します。

RGBブレンドは赤・緑・青の各チャンネルを直接補間するため、反対の色相を混ぜるとグレーを通過することがあります。HSLブレンドは代わりにカラーホイールを回転するので、中間ステップは彩度を保ち、より色鮮やかに見えます。

ステップ数を1に設定してください。1つだけの中間シェードがブレンドの中間点になります。2色の数値的な平均を得たい場合はRGBモード、色相ホイール上の知覚的な中間点を得たい場合はHSLモードを使います。

はい――2つの端点色の間の段階的なブレンドは、まさにチャートやヒートマップ向けの連続カラースケールの作り方そのものです。ステップを生成し、「すべてコピー」をクリックして、値をチャートライブラリのカラー配列に貼り付けてください。

中間シェードは1から10まで生成でき、開始色と終了色を合わせると最大12個のスウォッチになります。それぞれをお好みのフォーマットで個別にコピーできます。