Toshi’s Enjoy Life

書きたいことを書く雑記ブログ!

【色の知識】知ることでもっと楽しくて面白くなる!(RGBとCMYKの違い)

f:id:tosikun0119:20170409215728j:plain

 

みなさんこんにちは!

 

久しぶりの1からの挑戦シリーズです。久しぶりとあって真面目な記事を書くのはちょっと違和感がありますが、気にせずいきたいと思いますよー!

 

今回は色の基本である「RGB・CMYK」について書いていきます。

webサイトやブログのデザインには欠かせない重要な知識の一つだと思うので、しばらくの間【色の知識】をシリーズ化して一緒に共有していきたいと思います!

色の知識第一弾です。ではいってみましょう!

 

目次

  

色の基本:RGBとCMYKとは?

「色の三原色」という言葉は聞いたことあるでしょうか?

知っている方は余裕だよー!と言われてしまうのですが、三原色には2つの種類があります。

 

  • 色の三原色 (CMYK)
  • 光の三原色 (RGB)

 

というのがあります。詳しくは次の項で書いていきます。

 

色の三原色:CMYKとは

CMYKってなにやら暗号みたいな文字ですよね。でもちゃんとした意味があるのです!

ではどういったものなのか見ていきましょう!

 

  • C(Cyan:シアン)
  • M(Magenta:マゼンタ)
  • Y(Yellow:イエロー)
  • K(Black:ブラック)

 

の文字をそれぞれ取っています。

そしてこの名前は、最近では身近なものに使われています。よーく思い出してください!

 

そうです。これらはプリンターに使われているインクカートリッジの名前のはずです。

この三色が混ざることによって黒(Black)になるのです。

 

f:id:tosikun0119:20170409200428j:plain

画像引用元:色の基本用語事典 - 色の三原色など色彩に関する用語解説

 

光の三原色:RGBとは

それではRGBというのはどういったものでしょう。

 

  • R(Red:赤)
  • G(Green:緑)
  • B(Blue:青)

 

のことで、赤青緑を表しています。

この三色が混ざることによって(白)が生み出されます。

 

そして、今まさにこの記事を見てらっしゃる画面。この画面では「光の三原色」によって構成されています。 

 

f:id:tosikun0119:20170409200427j:plain

画像引用元:色の基本用語事典 - 色の三原色など色彩に関する用語解説

 

CMYKとRGBの使い分け

CMYKは色の三原色、RGBは光の三原色ということは説明しました。

では実際にどのように使い分けるといいのでしょうか?

 

これを単純に説明するなれば、

 

サイトをデザインするときは「RGB」、それを印刷したいときには「CMYK」

 ということになります。

 

サイトやブログはパソコン画面で表示されますよね。

ということは、パソコン画面で表示されることを前提に色をつけてデザインしなければいけません。

画面は光の三原色がベースに構成されているので「RGB」ということになります。

 

webデザイナーさんは、クライアントさんと交渉や打ち合わせにデザインした資料を印刷して使うことがあると思うのでご存知かと思いますが、印刷するとなると「CMYK」で印刷しないといけないです。

 

印刷はプリンターでしますよね?

思い出してください!プリンターのインクカートリッジ名を!

 

C:シアンM:マゼンタY:イエロー、K:ブラック

 

でしたね!この理由からデザインした色を再現するにはRGBからCMYKに変える必要があるのです。

 

もちろん「RGB」で作成した色を「CMYK」で完全に再現することは不可能です。

プリンターや印刷紙によって変わってきますし、そもそも三原色の種類が違うので。

 

※ここでいう使い分けは、パソコンで色を作るときは「RGB」、印刷するときは「CMYK」で印刷しないと、全くの別物となってしまうという意味で表現してます。

 

まとめ

専門職でない限り、このRGBやCMYKという言葉は聞きなれない言葉だと思います。

ですが、

C(Cyan:シアン)、M(Magenta:マゼンタ)、Y(Yellow:イエロー)、K(Black:ブラック)

 

と聞けば、プリンターに使われているインクカートリッジの名前と思い出せれば意外と身近なものではないでしょうか。

 

Photoshopやillustratorなどでサイトの色をデザインするときは、「CMYK」ではなく「RGB」でデザインしないと、想像していた色と違ってしまうということが見えてくると思います。

 

この記事ではサイトやブログをデザインしていくにあたって、まず基本となる「RGBとCMYKの違い」について書きました!

次回以降は「明度」「彩度」について書いていきたいと思います!

 

では今回はこの辺で☆

 

関連する記事です!併せてどうぞ!

www.toshi-enjoy.com

 

www.toshi-enjoy.com

 

www.toshi-enjoy.com