カラースキームジェネレーター

このツールについて

カラースキームジェネレーターは色彩理論を使用して、1つのベースカラーから調和のとれたパレットを生成します。

このアプローチはプロのデザインツールで使用される方法と同じで、ほとんどのデザインシステムカラーパレットジェネレーターの基盤です。

スキームの種類

• 補色: カラーホイールで反対側にある2色 (180°)。高コントラスト。
• 類似色: 隣接する3色 (±30°)。調和的で自然。
• トライアド: 均等に配置された3色 (120°間隔)。鮮やかでバランスが良い。
• テトラード: 均等に配置された4色 (90°間隔)。豊かで複雑なパレット。
• スプリット補色: ベース + 補色に隣接する2色。高コントラストだが柔らかい。
• モノクロ: 同じ色調の5つの明度。繊細で統一感がある。

活用事例

ブランドデザイナーは1つのブランドプライマリカラーから完全なパレットを生成します。Web開発者はホバー状態の補色アクセントカラーを選択します。

よくある質問

• 一部の色が似て見えるのはなぜ? — 彩度や明度が非常に低いか高い場合に発生します。より彩度の高いミッドトーンをベースとして試してください。
• TailwindやCSSで使用できますか? — はい。16進数コードをコピーしてtailwind.configのカスタムカラーやCSS変数として使用できます。
• HSLとは? — 色相・彩度・明度。色相はカラーホイールの角度(0〜360°)、彩度は強度、明度は明るさです。