【デザイン】RGBとCMYKの違いって何?カラーコードの覚えかた

どうも。こんにちはBAYAKO(ばやこ)です。

今回は色の基礎的な知識の話をしようと思います。
webや印刷で色を使う機会ってあると思うんですが、色の知識がなくても何となくでも絵とかデザインってできちゃいますよね。
いざ仕事を受けた時や、印刷所などのプロの方と話す時に変な空気にならないようになればと思います。

“BAYAKO”
おまけでCSSなどで使うカラーコードの話もしますねー

RGBやCMYKってまず何?

illustratorなどデザイン系のソフトを使う時にRGBやCMYKかを選択することってありますよね。
よく分から無いので、「OK」をおす なんて事になっていませんか?

実は色選択は作る媒体によって変更が必要です。
twitterやピクシブなどにイラストを載せたい、webデザインやスマホのアプリデザインをしたい、なんて時はRGBです。
画集や年賀状、冊子などインクを使って印刷するものはCMYKです。

何となく察しがいい人は「あ!」と思ったかもしれないですね。
そうです。家にプリンターがある人はわかると思いますが、インクって青、黄色、赤と黒のインクを使っていませんか?(プリンターによっては7色印刷もありますが)
そうなんです。印刷は4色で作るんです。

ちなみにPhotoshopでもillustratorでも、RGBとCMYKの変換はできます。
ただし一度RGBからCMYKへと変換したら、もう一度CMYKからRGBへ変換し直しても、綺麗なRGBには戻れなくなります。
RGBの方が鮮やかなんですよね。
CMYKへの変換時には充分注意しましょう。

RGBとは

モニター、TV、スマホでみるデザインやイラストはRGBという説明をしましたが、画面上で使う発色方式はRGBで行います。
RGBはそれぞれレッド(Red)、グリーン(Green)、ブルー(Blue)の頭文字をとったもので、この3色は「光の三原色」です。
色数が多く、鮮やかです。

全ての色を3色って本当!?ってなりますよね。
雨の日にスマホが濡れた画面ってなんか粒々が見えませんか?
よ〜く見ると3色の粒々で色って作られているのです。

CMYKとは

紙などの印刷物に使う発色方式はこちらです。
CMYKはシアン(Cyan)、マゼンタ(Magenta)、イエロー(Yellow)の3色にブラック(Black)を加えたものです。
よく「印刷はカラーは高いからモノクロにして〜」なんて話でますよね。
黒単体があるので可能です。
色はCMYで3色重ねると来るにはなるんですが(絵具で混ぜると濁って茶色っぽくなった記憶ってありませんか?混ぜれば黒に近づくのです)それだとはっきりした黒にならないんですよね。

なのでCMYKの4色で色は印刷します。
たまに聞く間違えで「YMCAにしといて〜」みたいな人がいますけど、それは歌なのでw
ちょっと単語が似てますよね笑

印刷はモニターのRGBとは違い発色が落ち着いています。
蛍光色はできないので、印刷所に蛍光色をお願いする場合は特色と言って蛍光いピンクなど別料金で頼んだりします。
自宅プリンターでは再現できない色が、印刷所でお金で近いところまでは解決できるって事ですね。

RGBで印刷、CMYKでwebサイトを作ったらどうなる?

間違えて逆で作ってしまう、なんてこともありますよね。
RGBで印刷すると、モニターでみたときとは違う色(たまに全然違う色)で印刷される子があります。気をつけましょう。
webサイトなどモニターで写すタイプの作品をCMYKで作ってしまった場合は、発色が落ち着いたままで、CMYKからRGBに戻しても落ち着いた色のままになる、という感じです。
事故にはなりませんが、使える綺麗な色が減るって感じですかね。

#FFOOOOみたいなカラーコードの意味がわからない

webサイトを作っているとRGBのカラーコードで「#FFOOOO」なのがでてきませんか?
覚えられない!赤って何番だっけ?みたいになると作業効率って落ちますよね。

私は16進数というものを理解していなかったので、何で「#YYZZ00」みたいのは無いの?って思っていました。

16進数は16個の数字です。
0123456789ABCDEF で16個
だから #000000は黒で #FFFFFFは白なんだなってわかってきますよね。

ちなみにRGBで0とFを組み合わせると番号を覚えることができます。
コーディングで青って何番だっけ?エラーを赤でバグを見つけるのに使いたい みたいな用途で使えるので、覚えておくと作業が上がりますよ。

まとめ

今回は基礎的なカラーコードについて説明しました。
よく分からないけど、デザイン作ってた!印刷所で失敗したーなど経験がある人は参考にしてくださいね


BAYAKO

イラスト活動や、デザインの勉強で迷っている人の道しるべになればと立ち上げたブログです。
灯り屋 という名前でサークル活動もしています。


コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です