カラーハーモニー理論 — 補色・類似色・トライアドの使い方
カラーハーモニーは色同士の組み合わせの法則で、ベースカラーに対してどの位置の色を組み合わせるかでさまざまな印象を作れます。デザインでプロらしい配色を実現するための基礎知識です。
補色（Complementary）とは
補色は色相環の正反対（180°）に位置する色の組み合わせです。赤と緑、青とオレンジのような強いコントラストが生まれ、目立つCTAボタンやアクセントカラーに有効です。補色を使いすぎると視覚的に疲れやすいため、一方を主色・もう一方をアクセントとして小面積に使うのがコツです。
類似色（Analogous）とは
類似色は色相環で隣接する2〜3色の組み合わせです。同系色なので統一感があり穏やかで自然な印象を与えます。自然をテーマにしたデザインや、落ち着いた印象のブランドカラーに向いています。類似色の中でも明度・彩度で変化をつけることでメリハリを出せます。
トライアド・テトラドとモノクロマティック
トライアドは色相環を3等分した3色（例: 赤・青・黄）の組み合わせでバランスと彩りを両立します。テトラドは4等分した4色でより豊かな配色ですが調和が難しくなります。モノクロマティックは同一色相の明度・彩度違いで、シンプルで洗練された印象になります。
HEX・RGB・HSL形式での利用
Color Palette Generatorは生成した各カラーをHEX・RGB・HSL形式で表示し、ワンクリックでコピーできます。CSS変数への貼り付け、Figmaへの転用、Tailwind CSSのカスタムカラー設定など、各ツールが求める形式にすぐ対応できます。