このツールについて
配色調和はカラーホイールから直接導かれる色相の関係です。補色は最大のコントラストのために正反対の2色相を組み合わせ、類似色は落ち着いた統一感のために隣り合う3色相をまとめ、トライアドは鮮やかでありながらバランスの取れた見た目のために3色相を均等に配置し、テトラードは豊かながらも調整が難しい配色のために4色相を均等に配置し、スプリットコンプリメンタリーは唯一の真の補色の代わりにその両隣の2色相を使い、視覚的な緊張を抑えつつ補色配色に近いコントラストを得られます。
ベースカラーを選び、配色スキームを選ぶと、このツールは同じ彩度・明度で他のすべての色相を計算し、セット全体が一つの色系統に見えるようにします。各スウォッチは正確な hsl() 値を表示し、クリックするとクリップボードにコピーされます——そのままCSSに貼り付けられます。すべてブラウザ内でローカルに実行され、何もアップロードされません。ベースカラーと最後に使ったスキームは次回のために記憶されます。
よくある質問
ウェブサイトにはどの配色スキームを使うべきですか？
類似色配色はコンテンツサイトに落ち着いた一体感を与える傾向があり、補色や分割補色配色はCTA（行動喚起）により強いコントラストを作ります。いくつか試してブランドに合うものを見つけてください。
これはカラーのアクセシビリティ／コントラストを考慮していますか？
いいえ。配色は純粋な色相計算であり、コントラストはチェックされていません。公開前に必ずテキスト/背景のペアをWCAGコントラスト比で別途確認してください。