1. HOME
  2. ブログ
  3. 色の組み合わせで変わる!サイトと色の関係-その1-

色の組み合わせで変わる!サイトと色の関係-その1-

みなさんこんにちは。

ネットショップの活性化を目指し、
ECサイト運営での黒字化を支援する

もなか」です。

本日は以前書いたアイキャッチ画像作りのコツから深掘りしまして
基本的な色の話をしたいと思います。

色が与える感情や印象ってすごいんだ!
ってことをちょっとでも伝えられたらなと思います。

-目次-
1.色のサークル”色相環”
2.明度と彩度
3.色の与える印象

1.色のサークル”12色相環”

昨日のカラーコードの記事に掲載されていたこちらの図


こちらが色をサークル上で表現した

【色相環】

と呼ばれるものです。

色相環には色々な種類がありますが
こちらは12色で構成された12色相環というものです。

そもそも【色相】って何だろう?ってところですよね。

色相とは…
色の属性の一つ。
例えば,この花は明るくあざやかな赤色をしているといって花の色を表現するが,
最後の赤色というのが色相である。
色相は基本的にはの四つがあり,
さらに赤と黄,黄と緑,緑と青,青と赤の混じったものがある。
したがって色相とは物を見たときに私たちが感ずる赤とか黄とか,
あるいはそれらの混じった黄赤などの視感覚ということができる。
-世界大百科事典 第2版-

小難しく書いてありますがざっくり簡単に言ってしまえば、
私たちが生活する上で「色」と言っているものが
「色相」だという認識で大丈夫です。

色の分類として
赤、だいだい、黄などのように暖かそうな色を「暖色」
青緑、青、青紫などの冷たさを感じさせる色を「寒色」
どちらにも属さない黄緑、緑、紫、無彩色などを「中性色」と言います。

また、色相環で正反対に位置する色の組み合わせを「補色」
色相環で隣り合った近くにある色を「近似色」と呼びます。
「紫の補色」と言えば黄色で
「紫の近似色」と言えば青紫と赤紫を指します。

2.明度と彩度

また色には色相の他に【明度】【彩度】の要素があります。

簡単に言えば……
【明度】色の明るさのことで、
明度が高いほど白くなり、明度が低いほど黒くなります。
上の図で言う【明色】と【暗色】を指します。

【彩度】色の鮮やかさのことで、
彩度が高いほど鮮やかになり、彩度が低いほどグレーに近くなります。

明度とは…
物体面(物体色)の明るさを表すためのものであるが,
一定の照明の下では白色の面がいちばん明るく見えるという性質があるため,
それを基準にしていい表している。
反射率100%の白色面の明度を10とすれば,種々の物体面の明度は0から10の値をとることになる。
明度が1と2の面の明るさの差と,明度が3と4の面の明るさの差とは同じというように,
明度は心理的な明るさの大きさを表すものとされている。
-世界大百科事典 第2版-

彩度とは…
彩度ということばだけからは色のあざやかさということになるが,
英語ではsaturation,つまり飽和度であり,全体の明るさに対する色みの割合ということになる。
したがって白色の彩度は0であるが,単色光の彩度は必ずしも1ではない。
とくに570nm近辺の光は明るくても色みの量は少なく彩度は低い。
これに対し700nmの光は赤の色みの量の占める割合が大きく彩度は高くなる。
しかし,日常ではもちろんのこと,色彩学の分野でも,
このように厳密に割合という意味まで考えないで使用する場合が多い。
-世界大百科事典 第2版-

同じ赤でも明るくて鮮やかな赤やくすんだグレーに近い赤など、
ひとくくりにはできない様々な色の調子があります。
この【明度】【彩度】によって決まる
色の調子のことを【トーン】と呼びます。


http://www.dic-color.com/knowledge/pccs.html

3.色の与える印象

ここまで【 色 】についての基本的な事を見ていきました。
では色の与える印象にはどんなものがあるのか見ていきましょう。

… 情熱さ、強い生命力、アクティブ、興奮

オレンジ … 元気、親しみやすさ、陽気、楽しい

黄色 … 明るい、快活、希望

 緑 … 安らぎ、穏やかさ、くつろぎ

… 神秘的、厳粛、高貴、不安

… 落ち着き、知的、静か、理性

… 神秘、威厳、高級、自信

・ 白 … 純粋、清潔

基本的にはこういった印象をもたれます!
ただ、組み合わせや色のトーンによって印象はガラッと変わります。


次は実際にサイトで色がどのように使われていて
どんな印象を与えているのかについてお伝えします。

それでは、また。

関連記事

おすすめの虎の巻

最近の虎の巻

カレンダー

2019年5月
« 4月   6月 »
 12345
6789101112
13141516171819
20212223242526
2728293031