配色は、レイアウトするのと同等に大切なデザインの役割があります。

  • このエントリーをはてなブックマークに追加

今回は色に関する簡単なお話を記してみたいと思います。

当社には「色の手帳」という古い書籍があります。
小学館が発行した書籍で初版が昭和61年なので立派な古書です。笑
まだWEBが普及していない頃なので、印刷用のデザインをするために購入したもので、358色の色の名前を記してあります。帯には「データ付」となっていますが、データとは「色相」「明度」「彩度」という3属性を数値にしたもので、JISにあるものはそれを記されていますが、358色の中にはJISにないものも含まれていることになります。(JISの色数は269色と書かれたサイトはたくさんあります)
358色という数値は、単にこの書籍で分類された色数ですが、後に記す色相(HUE)の360色と近いので関係がないとはいえないかも?
この書籍にある358色は「日本の伝統色」が多く採用されていますので、伝統的な色の名前とその色を引くことができます。この書籍の要素をWEB化したような日本の色名をスマートに表示できるサイトもあります。

日本の伝統色サイト
NIPPON COLORS
https://nipponcolors.com/
(残念ながらスマホ最適化がされていません)

印刷の三原色(色料の三原色)を「減法混色」といいCMYで表記されます。
WEBの三原色(光の三原色)は「加法混色」といいRGBで表されます。

(印刷はC(シアン)+M(マゼンダ)+Y(イエロー)の3色でほぼ再現できるのですが、黒文字を3色で表すことになると、精度が低い時代はズレることもあって醜くもなってしまいます。K(黒)を足すことでカラー印刷時の黒文字を1色で刷ることができ、また、写真の黒い部分をよりくっきりとメリハリを付けることができるため、今でも一般的なカラー印刷機は4色刷機が主流ですが、多様化した現代では5色機なども存在しています)

HUE 360色とコンピューターの256色


HUEとは色相のことで、グラデーションを24等分して各色を15階調に分割した360色がアプリになって提供されており、サイトで無償で使用できます。

配色理論サイト
HUE/360
http://hue360.herokuapp.com/
(残念ながらスマホ最適化がされていません)

PCで使われる256色とは、8ビット時代に表現できた色数で、今のPCやテレビでは24ビットカラー1677万色(フルカラー)で表示しています。
(テレビとかでは実際にはフルカラーといえども1677万色は使われていないような気がしますが、素人に調べようがありません。人間の目の識別には個人差もあり限界があると思われるので、32000色でも十分かもしれません? でも、4Kテレビ8Kテレビに対してはそんな疑いは持っていませんが。笑)

画像、動画フォーマットの色


JPEGやPNGフォーマットはフルカラー対応ですが、WEB用のお手軽アニメに使われるGIFフォーマットではカラー数は最大256色なので、線画、セル画だけならまだしも、写真を扱うとガビガビの色になってしまうことは体験された方もあるのではないでしょうか。フルカラーで動画を扱うには現時点ではMP4とかWMVとかMOVのフォーマットにしないとWEBサイトでは表示できません。

CMYKとRGB(16進数カラーコード)の色指定


DTP以前〜DTPを始めた頃のデザイナーはインキの色「C+M+Y+K」という4色の配分で色指定をしていましたが、印刷以外のデザインでは「R(赤)+G(緑)+B(青紫)」で指定をするデザイナーが増えてきています。(余談ですがDTP以前の写真製版は各色10%刻みでしか色指定ができないため、写真以外の階調はカクカクしたものでした)
WEBでは黒(#000000)〜白(#FFFFFF)16×16×16×16×16×16(16の6乗)色間で色指定をするのが一般的ですが、標準色はred(#FF0000)とかblue(#0000FF)などの色の名前で指定しても表示するようにブラウザ側で140種類ぐらいは名前でも認識するようにプログラムされています。

WEBカラー指定参考サイト
原色大辞典
https://www.colordic.org/
(残念ながらスマホ最適化がされていません)

※DTP:PCを使った印刷デザイン(DeskTop Publishing)
以上、今回は色の基本を書きましたが、配色については何も書けませんでした。
ですので配色に伴うなんらかのシリーズ化を密かに企んでいます。(笑)

お問い合わせはこちらまで!

この記事を書いた人

ターニャPROFILE
グラフィックデザイナーを目指して入った学校ではまだDTPもWEBもない時代。
その後、一向社の制作部に入って数年後に仕事でMacの存在に触れ、会社で初めて使ったツールはMacintosh IIfx(ツーエフエックス)。最初AIのVer.3.0やPSのVer.2.0あたりを必死に学んだ後はなんやかんやで社内では年長者になり、現在もなおツールの進化とアプリの進化にOJT(オン・ザ・ジョブ・トレーニング)中!(笑)
現在の専門はWEBと映像編集など。
  • このエントリーをはてなブックマークに追加