トリアディックカラー

トリアディックカラーとは？

トリアディックカラーは、カラーホイール上で均等に配置された 3 つの色で、正三角形を形成します。各色は 120 度の色相回転で区切られているため、2 つの色が隣り合うことはありません。例えば、ベースカラーが色相 199° のスカイブルーの場合、そのトリアディックパートナーは 319°（マゼンタ）と 79°（黄緑）に位置します。これら 3 色が一緒に、活気とバランスのとれたパレットを作り出します。

トリアディック配色は、ヨハネス・イッテンが記述した古典的な色彩調和モデルの 1 つです。3 つの色相が最大限に分散しているため、強い視覚コントラストを提供しながらもバランス感覚を保ちます——各色はホイール上で同じ「重み」を持ちます。デザイナーは通常、1 色をドミナント、残り 2 色をアクセントとして使用します。

トリアディックパレットの色彩理論

HSL（色相・彩度・輝度）カラーモデルでは、色相チャンネルは 0° から 360° の度数で測定され、カラーホイールを一周します。トリアディック調和は、ベース色相に 120° と 240° を加えて他の 2 つの色相を取得することで得られます。彩度と輝度はそのまま保持されるため、3 色は同じ強度と明るさを共有します——変化するのは色相のみです。

人間の目は色相、彩度、輝度を比較的独立して知覚するため、彩度と輝度を一定に保つことで、3 色が同じ強度の「ファミリー」に属すると感じられます。結果として、鮮やかなコントラストがありながらも雑然としないパレットが得られます。

トリアディックカラーを使用する場面

トリアディックパレットは、活気と多様性を犠牲にせずに調和が必要な場面で最適です：

• 活気のあるブランドデザイン。 スタートアップ、玩具、子供向け製品は、トリアディック配色で楽しさと創造性を伝えます。
• イラストとポスターアート。 3 つの適切に離れた色相が、イラストにダイナミックなルックをもたらします。
• Web アプリのダッシュボード。 トリアディックカラーを主要アクション、セカンダリ要素、アラートに割り当てます。
• データビジュアライゼーション。 トリアディックカラーは十分に区別でき、カテゴリ別チャートに適しています。

トリアディックカラーの見つけ方

このツールを使えば、トリアディックカラーを簡単に見つけられます。すべての操作はブラウザ内でローカルに実行されます——アップロード不要、登録不要。

1. ベースカラーを選択。 カラーピッカーを使って任意の開始色相を選びます。
2. 結果を確認。 右側パネルにベースカラーと 2 つのトリアディックパートナー（120° と 240° 回転）が即座に表示されます。
3. HEX をコピー。 任意のスウォッチの横にある「コピー」ボタンをクリックして HEX コードをコピーします。

トリアディック配色の作り方

トリアディック配色は 3 色を提供しますが、各色相のティントやシェードを生成してさらに拡張できます。例えば、青、赤黄、黄緑のトリアディックセットから始め、背景用に青のより明るいティント、テキスト用に赤黄のより暗いシェードを作成し、コールトゥアクションボタン用に黄緑を完全彩度のまま使用できます。