1. TOP
  2. お役立ち情報
  3. デザイナーなら知っておきたい「色の基礎知識」を詳しく解説!

デザイナーなら知っておきたい
「色の基礎知識」を詳しく解説!

投稿日
2022.11.24
更新日
2023.06.15
デザイナーなら知っておきたい「色の基礎知識」を詳しく解説!

印刷物やWEBサイトに限らず、デザインする上で「色」は重要な鍵です。どんな組み合わせにするか、色を濃くするのか薄くするのかなど、選択肢は無限。デザイナーが悩むポイントです。
また、同じ色でも印刷とWEBサイトでは考え方・作り方が全く違います。

今回はデザインに必須の「色の基礎知識」について解説していきます!

色の基礎知識

色の基礎知識

今、あなたが見ている色は、光が対象物を照らした時に反射することで発生する、目に見えない波長が目から脳へ伝達し、そこで多彩な色が認識されるようになっています。
反射する波長を分解すると、文字通り波のようなイメージになります。

可視光線

私たちの脳へ無限にある色を正常に伝えるために活躍するのが、色覚(色の見え方)と呼ばれる色を知覚する「視細胞」です。

「視細胞の種類は、赤・緑・青があり、液晶ディスプレイや有機ELディスプレイ(OLED)やスマートフォンやパソコンなどの画像再現に使われている「RGB」と同じ役割をもった細胞だと言われています。

色に頼りすぎないデザインを心がける

もし「赤・緑・青」を知覚する視細胞に異常がある場合、色の見え方は変わります。
そして、その場合「色弱」「色覚異常」と診断されます。

これは決して珍しいことではありません。
統計によると、色弱の方は日本に320万人いらっしゃると言われています。

そのため、特にユニバーサルなデザインでは、色に頼り過ぎず、分かりやすく認識しやすいデザインにする必要があります。

印刷物で使う色「CMYK」とWEBで使う色「RGB」?

印刷物で使う色「CMYK」とWEBサイトで使う色「RGB」

上述でお伝えした通り、視細胞には「RGB」と同じ役割がありますが、ここで疑問にあがるのが「ではCMYKって何?」ということでしょう。

RGBやCMYKとでは、色の発色方法が異なります。

  • RGB=光の三原色と「加法混色」
  • CMYK=色材の三原色と「減法混色」

ここからは、加法混色・減法混色について解説していきます。

RGB = 光の三原色と「加法混色」

加法混色

Rは赤・Gは緑・Bは青を表し「光の三原色」と呼ばれます。
色を混ぜる程明るくなり、最後は白になるのが特長です。ディスプレイ機器などで使用する色の発色方法です。

混ぜれば混ぜるだけ白になる……このイメージにお気づきの方も多いかと思いますが、光と同じ仕組みなのです。真っ暗の中、色々な色のスポットライトを当てていくと、全てが重なり合っている部分は白になります。これを表現したのが上記の画像です。

そのため加法混色は、光の混色とも言われています。

ディスプレイの違いで色味に差が出るのは致し方ない

  • 「このサイトの色にして欲しい」という要望で同じ色にしても「違う」と言われる
  • 「事務所で見せてもらったけど、帰宅してから自分のPCで見ると色が違った。元に戻して欲しい」と言われたが、変更はしていない。

……などなど、仕事をしているとクライアントからこのような意見をもらうことがあります。

実は、光の混色とも言われている「加法混色」は、各ディスプレイや状況によって見え方が変わりやすい色味。各メーカーが発表しているパソコンの性能によっても違いますし、クライアントのディスプレイ設定が明るかったり暗かったりしても見え方は変わります。

そのため、クライアントの見え方に合わせるのは至難の業です。

調節したとしても、クライアントが別のディスプレイで見た際、また色味が違う可能性もあります。こういった際は、ディスプレイ環境によって見える色が変わることを説明し、ある程度の差は理解してもらいましょう。

CMYK = 色材の三原色と「減法混色」

減法混色

印刷物の制作ではお馴染みですが、Cはシアン・Mはマゼンダ・Yはイエロー・Kはブラックを表した「色材の三原色」と呼ばれます。絵の具と同じで、色を混ぜる程暗くなり、最後は黒に近くなるのが特長で、印刷物などで使用する色の発色方法です。

なぜ、混ぜ合わせて黒に近づくのに、予め「K=ブラック」が含まれているかと言うと、本当の黒にするためには、CMYKを混ぜるだけでは難しいためです。

CMYKはDICカラー指定することで、印刷時に意図した色味にできる

インクや印刷を行う紙、印刷機によって色味は微妙に変化してしまいます。しかし印刷の現場では、デザイナーが意図している色を正確に再現することが求められています。

そこで活用するのが、約600種類の色が収録されている「DICカラーガイド」です。
例えば赤と言っても、明るい赤だったり、暗めの赤だったり、赤でも様々な色味があります。
デザイナーは意図する赤を印刷現場へ伝えるために、「DICカラーガイド」の中から番号で指定する必要があります。

ただ、指定するだけでは完全に一致するかは印刷機にもよるため、よりシビアに確認したい場合は、実際の印刷機で印刷を試しに行う本機校正を行う必要があります。

色の性質を表す三属性「色相・彩度・明度」とは?

色には3つの性質「色相」「彩度」「明度」があります。

  • 色相→種類の違い(例:赤・緑・青など)
  • 彩度→鮮やかさ(例:鮮やかな色、くすんだ色など)
  • 明度→色の明るさ(例:明るい、暗いなど)

何気なく皆さんが使っている、「赤」「くすんだ色」「明るい色」などは、この色の性質のことです。
因みに、明度と彩度が同じグループを表す場合は「トーン」と呼びます。

また、それ以外にも色にはいくつかの分類(種類)があります。

色の代表的な分類

色の代表的な分類

赤や緑といった色の種類でなく、色の分類はいくつかあります。代表的なのが、「有彩色・無彩色」「暖色・寒色・中性色」です。デザインの現場ではよく出てくるワードになります。

  • 有彩色、無彩色
  • →赤や青など色味をもった全ての色が「有彩色」
  • →黒や白や灰色が「無彩色」
  • 暖色、寒色、中性色
  • →暖かさを感じる有彩色が「暖色」(例:赤や黄色など)
  • →冷たさを感じる有彩色が「寒色」(例:青や紫など)
  • →暖色と寒色どちらにも属さない色が「中性色」(例:緑など)

最後に

最後に<

デザインする際「色」がもつイメージを利用するのも手!

暖色や寒色でご紹介した通り、暖かさや冷たさなど、見る人にポジティブさやデメリットな印象を与えます。

例えば注意を促す標識では、「黄色」や「赤」が多いですし、大学病院などの建物で使用されている壁は、清潔さや落ち着いた雰囲気を感じさせる「白」が使用されています。こういった色で受けるイメージを「色彩心理学」と呼びます。

一概に言えませんが、一般的に以下の例があげられます。

  • 白=清潔、明るい、潔白
  • 黒=高級感、男性的、威厳
  • 赤=情熱、愛、活気、危険
  • 緑=自然、平和、癒し、未熟
  • 青=冷静、誠実、知的、冷淡

といったイメージですが、これは国によって文化が違うため、上記の色でも印象や好まれる色も変化します。
例えば緑は、欧米では「活気・若い・毒・怪物・不気味」、西洋では「若さ・新しい生命」、イスラムでは「国の繁栄・神聖」などと千差万別です。

デザインする際は、クライアントの要望に添いつつ、見るのがどの国の人が多いのか確認し、色がもつ印象を活用してデザインすることが重要です。

関連記事