トライアド配色ファインダー

トライアド配色は、デジタルの色相環を同じ長さの3つの弧に分けます。HEXカラーを1つ指定すれば、最初のHSLの彩度と明度を変えずに、残り2つの色相の向きが得られます。基準色と関連色を常に同じ順序で並べるので、そのままデジタルデザインにコピーできます。絵の具や印刷ではなく、HSLの幾何学的な関係を示すものです。

使い方

1. 先頭の#の有無を問わず、不透明な3桁または6桁のHEXカラーを入力します。
2. この配色関係では、角度の間隔は固定されています。
3. HEXの一覧と色相オフセットの表をあわせて確認します。
4. 得られた色を、実際の文字色・背景色・周囲のレイアウトの中で試します。

計算式

hues = (h, h + 120, h + 240) mod 360

色相は360度で一周して元に戻ります。元のsRGBカラーの彩度と明度を保ったまま、新しいRGBの各チャンネルを0〜255の最も近い整数に丸めます。基準のHEXはそのまま保持されます。

計算例

赤#FF0000から始めると、緑#00FF00と青#0000FFが得られます。HSLの色相は0度、120度、240度で、彩度は100%、明度は50%です。