色が与える印象(色で印象は大きく変わります!)

色によって、与える印象が異なることを知っていますか?

各色が与える印象とその色を使っているWEBサイトをまとめてみました。

  1. 青色
  2. 赤色
  3. 濃い赤色
  4. 黄色
  5. オレンジ色
  6. 茶色
  7. ベージュ色
  8. 緑色
  9. ピンク色
  10. 紫色
  11. 灰色
  12. 白色
  13. 黒色

1.青色が与える印象

信頼・誠実・清潔・知的・安心・爽快

青色のWEBサイト ・・・ KDDI、インテル、ロート製薬、FANCL、ローソン、ポカリスエット など

青色は企業や士業、製品のWEBサイトにもおすすめです。

青色が与えるマイナス印象・・・憂鬱、寂しさ、孤独

2.赤色が与える印象

躍動感・情熱・力強さ・生命力

また、赤色は警告を与える色でもあるので警告や注意喚起などに意図的に使うことも出来ます!

赤色のWEBサイト ・・・ コカ・コーラ、オロナミンC、味の素、キューピー、KITAKT、任天堂 など

赤色が食品のWEBサイトと相性が良いということが分かりますね。


3.濃い赤色が与える印象

高級・落ち着き・成熟

濃い赤色のWEBサイト ・・・ VS(ヴィダルサスーン)、資生堂TSUBAKI  など

濃い赤色はブランドのWEBページと相性が良いですね。

赤色が与えるマイナス印象・・・嫉妬、暴力的、攻撃的

4. 黄色が与える印象

明るい・活発・軽快・希望・光

黄色のWEBサイト ・・・ マツモトキヨシ、Nikon、ヤマト運輸 など

黄色は子どもに関する関するサービスや楽し気なWEBページと相性が良いですね。

黄色が与えるマイナス印象・・・騒がしい、幼稚、軽快

5. オレンジ色が与える印象

活発・陽気・賑やか・親しみ・暖かさ

オレンジのWEBサイト ・・・ じゃらん、au、LIXIL、キッコーマン、吉野家  など

オレンジ色も黄色と同様に 子どもに関する関す WEBページと相性が良いですね。

黄色よりも親しみやすい印象になりますね。

オレンジ色が与えるマイナス印象・・・安っぽい、落ち着きがない

6. 茶色が与える印象

自然・安定・落ち着き・温もり・安定・歴史・アンティーク

茶色のWEBサイト ・・・ SNICKERS(R)、上島珈琲店、ビジュピコグループ など

茶色は色から連想されるチョコレートや珈琲ショップのWEBページが多いですね。

茶色が与えるマイナス印象・・・地味、退屈、保守的

7. ベージュ色が与える印象

穏やか・優しさ・安心・ナチュラル・リラックス

ベージュ色のWEBサイト ・・・ 幼稚園やクリニック(婦人科・小児科・歯科) など

ベージュ色が与えるマイナス印象・・・退屈、素っ気ない、ぶなん

8. 緑色が与える印象

自然・健康・平和・優しさ・安らぎ

緑色のWEBサイト ・・・ ゆうちょ銀行、伊藤園、日本財団、SUUMO、モンダミン、ファミリーマート など

緑色は、病院・不動産・銀行のWEBページに多く使われていますね

緑色が与えるマイナス印象・・・保守的、未熟、受け身

9. ピンクが与える印象

優しさ・愛・幸福・春・女性らしさ

ピンク色のWEBサイト ・・・ ゼクシィ、OZmall、ダイソー、ビュティ―ラボ など

ピンク色は、女性向けサービスやコスメのWEBページと相性が良いですね。

ピンク色が与えるマイナス印象・・・優柔不断、夢見がち、不安定

10. 紫色が与える印象

優雅・気品・伝統・神秘

紫色のWEBサイト ・・・ ANNA SUI、俄 NIWAKA、乃木坂46公式サイト など

紫色は、和風や大学などの歴史のあるWEBページとも相性が良いですね。

紫色が与えるマイナス印象・・・不安定、疲労感、不吉、孤独

11. 灰色が与える印象

上品・洗練・大人・信頼・硬質

灰色のWEBサイト ・・・ RMK、SHIRO、弁才天(フルーツ大福) など

灰色は製品のWEBページと相性が良いですね

灰色が与えるマイナス印象・・・曖昧、無気力、憂鬱、地味

12. 白色が与える印象

清潔・純粋・無垢・クリーン・シンプル

白色のWEBサイト ・・・ FRISK、今治タオル、Francfranc など

白色は、WEWBページのベースの色になりやすいので、広く使われていますね。

白色が与えるマイナス印象・・・空虚・完璧主義・潔癖・冷たい

13. 黒色が与える印象

高級・重厚・権威・気品・大人

黒色のWEBサイト ・・・ AlfaRomeo(アルファロメオ)、虎ノ門ヒルズ、adidas、サンテFX、KATE、MAQuillAGE など

黒色のWEBページは写真を際立たせて見せることが出来ますね。

黒 色が与えるマイナス印象・・・絶望、孤独、恐怖、威圧

最後に・・・

「色の印象」と「その色を使ったWEBサイトの印象」が同じではありませんか?

見ている人に与えたい印象を考えて、色を決めたりするのも一つの手ですよね。

どの色が良いか?などお悩みの方は、ぜひ参考にされてみてください!

関連記事

  1. マネしたくなる美容室サイト7選!

  2. カラーユニバーサルデザインとは?

  3. 様々なデザイン方法

  4. レスポンシブデザイン検索サイト まとめ7選!

  5. モデルリリース・肖像権とは?

  6. 写真から配色を決める方法 -Adobe Colorを使う場合-