配色ラボ
好きな色を1つ選ぶと、 色彩理論をもとに配色候補を生成します。 生成した色に近い色名や日本の伝統色も探せます。
配色方式から選ぶ
どんな雰囲気にしたいかで、使いやすい配色方式は変わります。 気になる方式を選ぶと、上の配色ラボへそのまま反映できます。
補色
色相環で反対側に位置する2色を組み合わせます。コントラストが強い配色です。
類似色
基準色の近くにある色相を組み合わせます。まとまりを作りやすい配色です。
分裂補色
補色そのものではなく、その両隣の色を組み合わせる3色配色です。
トライアド
色相環を約120度ずつ3分割した3色を使います。
テトラード（矩形）
色相環上の2組の補色を矩形状に組み合わせる4色配色です。
スクエア
色相環を約90度ずつ4分割する4色配色です。
同系色
色相を大きく変えず、明るさとクロマを変えてまとめる配色です。
明暗配色
同じ色相を中心に、暗い色から明るい色まで段階的に並べます。
迷ったら、目的から選ぶ
配色理論の名前を覚えていなくても大丈夫です。 「まとまり」「強調」「色数」の3つから考えると、 方式を選びやすくなります。
配色を作るときの基本
自動生成された色は、そのまま全部を同じ面積で使う必要はありません。 実際のデザインでは、役割と使用量を決めるとまとまりやすくなります。
まず基準色を決める
ロゴ、ブランドカラー、好きな色など、 最初に主役となる1色を決めます。 色名でもHEXでも配色ラボに入力できます。
色に役割を持たせる
背景、本文、メインカラー、アクセントなど、 色ごとに役割を分けると使いやすくなります。
面積のバランスを見る
強い色は少量でも目立ちます。 配色の印象は色の組み合わせだけでなく、 使う面積によっても変わります。
配色から、さらに色を調べる
気になる色が見つかったら、 色図鑑や比較ツール、色文化へ進んで詳しく確認できます。
配色ラボについて
どの配色方式を選べばいいですか？
自然にまとめたい場合は類似色、 はっきり差をつけたい場合は補色、 3色ならトライアド、 統一感を重視するなら同系色から試すと分かりやすいです。
色名ではなくHEXからも配色を作れますか？
はい。 基準色には色しるべの登録色だけでなく、 #7F72B2 のようなHEXカラーコードも入力できます。
生成された色はそのままデザインに使えますか？
配色候補として利用できます。 ただし、文字と背景の組み合わせでは コントラストや可読性も別途確認してください。 用途や表示環境によって最適な使い方は変わります。
日本の伝統色に近い色も分かりますか？
はい。 配色ラボでは生成色ごとに、 色しるべへ登録されている近い色や 日本の伝統色を探せる設計になっています。