【色彩心理学×無料ツールで超簡単】ブログを効果的に彩る配色探し・ジャンル別おすすめ色も解説

ブログをはじめると誰もが通る配色の問題。
この記事を読めば、今日のうちにあなたならではの最適な配色が見つかります。

はじめてブログを作ると慣れないツールを触りながら好きな色を選んで配色設定すると失敗します。
なんだか派手すぎたり、地味すぎたり、色が多すぎて落ち着かない感じになってしまったり。

もっとこだわろうと自力で色味を微調整していこうとすると
同じ“赤”でも暗い赤、明るい赤、薄い赤、濃い赤、青みがかった赤、黄みがかった赤…とあり、
最適な明度と彩度を探っていくと膨大な作業になります。

色はブログの印象を大きく左右します。そして読者の行動にも影響を及ぼし得る大事な要素です。

だからこそ、ブログツール内の既存のパレットからではなく、
しっかりとした意図を持って、あなたのブログにとって最適な配色を"簡単に”決めましょう。

配色を決めるためのポイント

メインカラーは色彩心理学を取り入れよう

メインカラーに合うあなた好みの組み合わせでパターンを構成しよう

この2点を踏まえ、以下で具体的な方法を開設していきます。

【簡単3ステップ】色彩心理学を使ったメインカラーの探し方

あなたが読者に与えたい印象、取ってほしい行動につながる色を見つけましょう。

まずはこの３ステップでメインカラー候補１～3色に絞り込みます。

メインカラー探しの手順１：相手に与えたい印象は何か

下のカラー一覧表からポジティブイメージの中から自分が読者に与えたい印象はどれなのかチェックしていきます。

“この印象が絶対に大事”ということを一つに絞れない場合には、どんどん複数選択していきます。
そして、最もチェックが多かった色がメインカラーの有力候補その１です。

色	ポジティブイメージ	ネガティブイメージ	行動への影響
赤	熱い、強い、情熱、勇気、興奮、元気、やる気	警戒、注意	行動力UP
オレンジ	暖かい、明るい、元気、活発、かわいい、親しみ	わがまま、騒々しい、軽薄	食欲増進、人間関係改善
黄色	明るい、元気、陽気、楽しさ、輝き、派手、ひらめき、注目	警告、危険、臆病	発想力UP
緑	安らぎ、落ち着き、平和、リラックス、生命力	初心者、保守的	疲労回復、緊張緩和
青	誠実、自由、陽気、広大、強さ、冷静	冷酷、悲しみ、寂しさ	集中力UP
青緑	柔軟性、知性、冷静、浄化	寂しさ、悲しみ	ストレス開放
紺色	忠誠、誠実、信頼、知性、理性、静寂	孤独	判断力UP
紫	大人っぽい、知性、高級、神秘的、官能的、個性的、芸術性	不安、怪しげ	発想力UP
黒	シック、高貴、重厚感、信頼、主張、	威圧、暗い、孤独、恐怖、不安	気持ちが引き締まる
白	純粋、清潔、繊細、神聖、無限、軽やか	空虚、虚無	リセット
ピンク	可愛い、恋愛、晴れやか、優しさ、柔らか、華やか	幼稚、弱々しい	美容効果
黄緑	フレッシュ、ナチュラル、爽やか、青春、気軽	未熟、子供っぽい、軽薄	心機一転
水色	冷静、洗練、繊細、爽やか、清潔、自由、変化、開放感	頼りない、奔放	集中力UP
グレー	シンプル、清廉、ソフトさ、知性、賢さ	曖昧、迷い、無気力
茶色	自然、温もり、落ち着き、信頼、安心感、素朴	地味、硬い	緊張緩和

【注意】この表のイメージや行動への影響は、あくまで日本人が対象です。

　　　　ブログターゲットが外国人の場合、国ごとに各色の持つ意味、イメージがまったく違うことがありますのでご注意ください。

メインカラー探しの手順２：相手に取ってほしい行動は何か

次に行動への影響を見ていきます。
あなたのブログが特化型で読者に取ってほしい行動が絞り込めている場合には、上表の「行動への影響」の欄もチェックしましょう。
例えば料理や食レポなど食べ物関連の特化ブログであれば、食欲増進効果のオレンジか赤が有効。

ここでチェックした色をメインカラー有力候補その２としておきましょう。

メインカラー探しの手順3：ジャンルごとに合った色は何か

色彩心理学上、各色の印象を重視してジャンルごとに最適とされている色がすでに判明しています。　
企業のロゴやイメージカラーも、心理学に基づく配色となっているケースがとても多い。
例えば牛丼御三家の吉野家・すき家・松屋も赤かオレンジになっています。

ジャンルごとに最適とされている色は下表のとおりです。

赤	飲食、キャンペーン等のお得情報
オレンジ	飲食、旅、キッズ関連
黄色	食品、スポーツ
青	BtoBサービス、医療・健康
緑	アウトドア、飲食、環境
紫	ファッション、宝飾、スピリチュアル関連
白	ニュース・トレンド、EC、美容
黒	車・バイク、宝飾
黄緑	新生活、研修・セミナー
ピンク	美容、ブライダル、女性向けサービス
グレー	工業系、家電、ファッション
茶色	インテリア、ホテル・旅館

ここで自分のジャンルに合う色があれば、それが有力候補その３です。

有力候補の3色をどのように使うか？

有力候補その１からその３がすべて同じ色だった場合には、迷わずその色をメインカラーにしましょう。

2色に絞り込まれた場合には、結果が2回一致した色をメインカラー、もう一方をサブカラーと仮置きしましょう。

3色バラバラの結果が出た場合には、3色ともいったん保留で次のステップに進みます。

有力候補の色を使って色味を決める最終作業：自分の感性を大事にする

ここから先は「自分がその配色を好きか嫌いか」の感性を最優先にします。
なぜなら、自分が好きな配色の方が、自分のブログを見てテンションが上がるから！

もし候補カラーの中にどうしても好きになれない色が含まれていれば、その色は捨てしまいましょう。

知識ゼロからブログ挑戦中の私の場合は「緑」「赤」「黄」という結果でした。
この3色を頭の中でイメージしたときに「派手～、信号機だ…ダサくなりそう～」と思いました。
でも大丈夫。
ここでどんな組み合わせが出てしまっても、デザインの知識が全くなくても、
あとは無料配色ツールを使えば、下の図のようにしっくりくる組み合わせに出会うことができます。

この時点でメインカラーを決められた人もそうでない人も、無料配色ツールで最終調整していきます。

おすすめの簡単配色ツール「COLORS」

COLORSはおすすめのグラフの配色パターンをそろえたサイトです。

トップページに早速多数のパターンが貼られているので、その中から自分の候補カラーの組み合わせを探していきます。

有力候補の１～３色を含む気に入ったパターンが見つかったら、右下の鉛筆マークをクリック。

すると下のような画面になり、7色分のカラーコードを確認することができます。

緑、赤、黄色の派手そうだった組み合わせが、いい感じに配色されました。

この7色の中で、どれをメインカラー（ヘッダー）にするかはグラフサンプルを見比べて最終決定します。

私の場合、ラブリーな感じにしたくなかったのでピンクが少なめの、左の円グラフのバランスが好み。
その感性により「メインカラーは緑、ポイントに赤、ピンクは少しだけ」にすることにしました。

ここで出た16進数のカラーコードはワードプレスでの色指定時にそのまま入力するコード番号です。
必要なときにすぐコード番号を取り出せるよう、スクリーンショットに残すことをおすすめします。

サムネ編集などにもこの配色を取り入れたい方は、画像編集ソフトによってはRGB番号が必要になることがありますので
16進数コードとセットで保存しておきましょう。

COLORSが他の類似ツールよりもおすすめな点３つ

①複数の配色パターンが一画面に表示されるので選びやすい。
　配色ジェネレーターと呼ばれる多くのツールは１パターンごとに画面が切り替わっていくものが多く、
　「やっぱ5個くらい前に見たやつがよかったかも？どれだっけ？」
　「今表示されているパターンと３つ前のパターンを比較したい」
　といった時に使いづらさを感じてしまいます。

②3色をベースにして追加4色、計7色のパターンを提案してくれる。
　多くのツールは3～4色の組み合わせを提案してくれますが、COLORSは7色まで。
　ブログのカラー設定のメインどころ（ヘッダー、見出し、ボタン等）は3色で作れますが、　
　ボーダーラインやサイドバーの文字など細かくこだわりたくなった時には7色あると助かります。

　7色使っても、ちゃんとしっくりまとまる配色を提案してくれるのはありがたい。

③パターンが無限に出てくるわけではないので選びやすく、決める作業が早い。
　色にこだわりぬいても、結局のところブログで最重要なのは記事の内容。色選びに時間を使うより良い記事を1本でも多く書いた方がよい！

まとめ

ブログ運用はやはり記事の投稿に集中したいので、配色決めに時間を費やすのはもったいない。
色彩心理学、自分の感性、無料ツールを使って、多く悩まずに決めてしまいましょう。