実務では「感覚だけ」はほぼ使わない。
でも最初からコード暗記・本丸暗記でもない。
ベースは配色パターン＋微調整が一番多い。
実案件で一番多い流れ
1.ベース色は拾うor借りる
・ロゴ、写真からスポイト
・既存サイト、LPから拝借
・配色サイトの完成セット
ここではコード入力することも普通にある。
2.カラーピッカーで調整
・明るすぎる
・文字が弱い
・写真と喧嘩する
H（色相）は動かさない
S（彩度）とB/L（明度）だけ触る
→彩度（安っぽい/うるさい）
明度（暗すぎ/明るすぎ）
※ここがデザイナー作業
3.自分で１から作ることは？
・ブランド設計
・ロゴ制作
・トーン統一案件
初心者・バナー案件ではほぼ無い
よく使われる配色ソース
・配色サイト（完成コード）
・海外LP、広告
・写真＋スポイト
「なんとなくで選ぶ」と、破綻はしにくい。でも弱い・素人っぽいになりやすい。
・色数を最大3色に縛る
・文字色は基本黒系or白系
・アクセント1色だけ強く
色ルール（簡易版）
・メイン色：１
・サブ色：１
・アクセント：１（CTA用）
・グレーは色数に数えない
実務での正解ルート
1.写真orロゴからスポイト
2.配色サイトで近い組み合わせを探す
3.文字が読めるようにだけ調整
4.CTA色だけ少し強める
写真基準で壊れないもの
写真→色を3色だけ使うルール
・メイン：写真の中で一番面積が大きい色
・サブ：影or背景の暗い色
・CTA:写真に無い1色だけ足す
センス不要。事故らない。
ブランド想定テンプレ配色
業種ごとの鉄板配色を使う。
例：
・カフェ：茶・ベージュ・白
・美容：白・グレー・くすみカラー
・IT:青・白・濃いグレー
・セール：赤orオレンジ＋白
オリジナル不要、案件では大体これ。
モノトーン＋１色逃げ
白黒＋CTA色１色
・文字：黒or濃いグレー
・背景：白or写真
・ボタンだけ：赤/青/緑など
迷ったらこれ。LP・広告で多い。
UI配色から拝借
アプリっぽい配色を使う。
・文字：#111/#333
・サブ文字：#666
・線：#DDD
。CTA：青系1色
ダサくならない・情報多めバナー向け。
明度差だけ意識する
色はともかく↓だけ守る。
・背景と文字の明度差だけ大きく
・CTAだけ一段濃くor明るく
色センス不要。
読める＝OK
配色を作る必要はなく、型を選ぶだけ。
微調整は明度と彩度のみ。
茶色を選ぶときの実務ルール（カフェ想定）
一言に〇色と言っても、色々ある。ここでは例として茶色、カフェ想定でルールをまとめる。
結論としては、色名（茶色・青など）で選ばない。
役割で決めて、数値で詰める。
1.まず役割を決める（重要）
同じ茶色でも役割が違う。
・背景用の茶色
・文字用の茶色
・アクセント用の茶色
ここを曖昧にすると「なんとなく」になる。
2.数値で決める（感覚禁止）
背景用の茶
・彩度：低め
・明度：高めor中間
・例イメージ：ミルク入りコーヒー
主張しない。
写真・文字を邪魔しない。
文字用の茶
・彩度：かなり低い
・明度：低め
・ほぼ黒よりの茶
黒より柔らかい、カフェ感が出る。
アクセント用（CTAとか）
・彩度：やや高め
・明度：中～やや低
・赤みorオレンジ寄り
「おいしそう」「温かい」
3.Figma/Photoshopでの具体操作
やる順番
・まず適当に茶色っぽい色を置く
・色相はほぼ動かさない
・触るのは、明度（明るい↔暗い）、彩度（くすむ↔鮮やか）
色相いじり始めたら迷子
4.良い茶色か判断する３チェック
・黒に近づけたら汚くならない？
→なるなら彩度高すぎ
・白文字を乗せて読める？
→読めないなら明度ミス
・写真より目立ってない？
→目立つなら主役奪ってる
5.なんとなくから脱出する合言葉
色を選ぶときはこう言語化して選ぶ。
・「これは背景用だから薄く」
・「これは文字用だから黒寄り」
・「これはCTA用だから少し赤み」
これ言えない色は使わない。
