色は3つまで
配色のきほんルール

色選びに迷って、気づけばサイトが7色のにぎやかなことに——初心者がいちばん転びやすい石が「色」です。ルールはひとつ。「3つまで」。

色が多いほど、素人に見える

色にはそれぞれ主張があります。たくさん使うほど主張がぶつかり、どこを見ればいいか分からなくなる。プロのサイトを観察すると、実は驚くほど色数が少ないことに気づきます。基本の配色は「ベース・メイン・アクセント」の3色です。

ハムちゃんこの島もそうなってるよ。クリームがベース、茶色とオレンジがメイン、ボタンやしるしに黄色。ね、3色ルールでできてるでしょ？

メイン色の決め方

メイン色は、感覚ではなく連想で決めます。お店の商品や雰囲気から連想される色（パン屋なら小麦の茶色、花屋なら葉の緑）、またはロゴや店内の色。そしてアクセント色はメイン色の反対側の色（茶色に対する青、緑に対する赤系）にすると、少量でもパチッと目立ちます。迷ったらAIに「茶色をメインにした3色の配色案を、色コードつきで3パターン」と頼めば、候補はすぐそろいます。

ハムちゃん「なんかチカチカする…」と思ったら、たいてい色の使いすぎ。色を減らす勇気が、いちばんの上達なんだ。

きょうのまとめ

• 配色はベース70%・メイン25%・アクセント5%の3色まで
• メイン色は商品や店の雰囲気からの連想で決める
• アクセントはメインの反対色を少量。迷ったらAIに3パターン頼む