# トライアド配色ジェネレーター

このトライアド配色ジェネレーターで、1つのベースカラーからトライアド配色を作成できます。3桁または6桁の16進数コードを入力すると、HSLカラーホイール上で120度ずつ離れた3色を、ベースカラーと同じ彩度と明度で、すぐに貼り付けられる16進数コードとして返します。インターフェース、イラスト、ブランドシステム向けに、バランスの取れた鮮やかなパレットを作りたいデザイナーや開発者に最適です。

## よくある質問

### トライアド配色ジェネレーターでは何が生成されますか？

6桁の小文字の16進数コードで3色を返します。色1はベースカラー、色2は色相を120度回転させた色、色3は色相を240度回転させた色です。

### トライアド配色はどのように計算されますか？

ツールは入力した16進数コードをHSLに変換し、色相に120度と240度を加え、結果を360度の範囲内に収めます。彩度と明度は変わらないため、3色すべてがベースカラーと同じ明るさと鮮やかさになります。

### 純粋な赤のトライアドは何ですか？

\#ff0000の場合、ツールは#ff0000、#00ff00、#0000ffの3色を返します。これらはRGBの三原色です。これは、従来の絵画で使う赤・黄・青のホイールではなく、画面向けのHSLホイールを使用していることを示しています。

### どの色形式を入力できますか？

\#3366ccや36cのように、#の有無を問わず3桁または6桁の16進数コードを入力してください。RGBおよびHSLの表記や色名には対応していないため、先に16進数に変換してください。

### ベースカラーが少し変わって返されるのはなぜですか？

計算では色相、彩度、明度に整数を使うため、ベースカラーをHSLに変換してから戻すと、チャンネルが1段階ずれることがあります。たとえば、#ff5733は#ff5833になり、残り2色は#33ff58と#5833ffです。

### トライアドパレットを派手に見せずに使うには？

1色を主役にし、残り2色をアクセントとして使います。たとえば、面積の割合を60、30、10パーセントにします。彩度の低い色や暗めの色をベースにすると、3色すべてがその彩度と明度を引き継ぐため、落ち着いた配色になります。

### 黒、白、グレーの場合はどうなりますか？

無彩色には彩度がないため、色相を回転させても同じグレーが3回返されます。異なる3色を得るには、ある程度の彩度がある色をベースに選んでください。

### トライアドとテトラードの違いは何ですか？

トライアド配色は120度ずつ離れた3色で構成されます。一方、テトラード配色は90度ずつ離れた4色で構成されます。トライアドのほうがバランスを取りやすいのが一般的です。4つ目の色相が必要な場合は、テトラード配色ジェネレーターをお使いください。

### このツールはアクセシビリティをチェックしますか？

いいえ、色を計算するだけです。3色はベースカラーと同じ明度を持つため、互いのコントラストが低くなる場合があります。コントラストチェッカーで、テキストと背景の組み合わせを確認してください。

### 出力はカラーパレットジェネレーターのトライアド設定と同じですか？

はい。このツールはカラーパレットジェネレーターのトライアド設定とまったく同じ計算を行うため、同じベースカラーからは両方とも同一のHEXコードが得られます。

ここに広告を掲載しませんか？

[メールでお問い合わせ](mailto:hi@dennn.is?subject=OneClick%20Pro%E3%81%A7%E3%81%AE%E5%BA%83%E5%91%8A%E6%8E%B2%E8%BC%89)

[広告 WordPress向けのエージェント対応プラグインスイート。](https://sleekwp.com/?ref=oneclickpro)