KOBITブログ

カラー配色+参考になるカラーチャートサイト、 女性向けファッションから見る、秋冬トレンドカラー

この記事は約 6分 で読めます。

color_image

Webページや印刷物などを見る際、閲覧者の目に一番先に入ってくるのは「情報」でなく「印象」です。 人間関係など、感情に左右されるものは第一印象が非常に影響力が強いのは確かで、それは印刷物やWebページなどの制作物にも当てはまります。 合わない配色での構成をしてしまうと、それだけで構成そのものにも違和感を持たれてしまうことも。 そこで、役立つのが配色技法です。 この配色技法でページ全体に統一感を持たせることで、整ったイメージを与えやすくなります。 また、アイディア出しの段階で色を見ることで、インスピレーションの参考にもなります。

基本的なカラー配色

1.ドミナントカラー配色

ドミナントとは、「支配」を意味します。つまり1つの色相が支配することです。 ドミナントカラー配色は全体を同じ色相で統一し、彩度や明度の違いにより変化をつけます。 同じ色相で色を構成しているので、まとまったイメージを簡単に印象付けることができます。

dominant

2.タイアード配色

補色の関係のある2色を組み合わせた配色です。 2つを混ぜると無彩色になる正反対の色の組み合わせなので、バランスのとれた色の関係となります。 彩度が高いと、2色が喧嘩してチカチカと目にとって負担のある配色になるので、 タイアード配色を使用する場合は彩度の低いものが最適です。 

tiered

3.トライアド配色

120度の色相差がある3色の色を組み合わせる配色です。 色相環で見ると正三角形の関係にある、バランスのとれた配色です。 色は互いに対照色相配色の関係にあります。 シアン・マゼンダ・イエロー、赤・黄緑・緑などの組み合わせが一般的です。 

triad

3.テトラード配色

90度の色相差がある3色の色を組み合わせる配色です。 テトラード配色は、黄・赤・青・緑の組み合わせが代表的です。 色相環で見ると正方形の関係にある、バランスのとれた配色です。 タイアード+白・黒もテトラード配色となります。 

tetrad

4.ペンタード配色

72度の色相差がある5色の色を組み合わせる配色で、赤・黄・緑・青・紫の配色が代表的です。 色相環で構成された色を結ぶと、正五角形になります。 しかし12色や24色の色相環の場合は5等分することができなくなり、 その場合はトライアドに白と黒を足したものをペンタードとするので トライアド+白・黒もペンタード配色となります。 

pentad

5.ヘクサード配色

60度の色相差がある6色の色を組み合わせる配色です。 色が多くあるので、場合によってはまとまりのないイメージを持たれてしまう危険性もあります。 テトラード+白・黒もヘクサード配色となります。 

hexad

参考になるカラーチャート一覧

■Color-Sample.com

color-sample-com

Color-Sample.com

Webで表現できる1600万色の色見本を見ることができるサイト。 配色見本を見ることができるので色からのアイディア出しにも最適です。

■Color Supply.com

color-supply-com

Color Supply.com

カラーチャートをぐるっとドラッグすることで好みの配色を探せるサイトです。 また、その配色を使ったイメージも見ることができるのでとても参考になります。

■kuler

kuler

kuler

adobeのカラー配色ツール。 ポイントをドラッグすることで、その他の適した色を感覚的に見ることができます。 配色パターンを作成でき、Illustratorやphotoshopにスウォッチとして登録が可能です。

■Color Scheme Designer

color-scheme-designer

Color Scheme Designer

メインのカラーを選択すれば、配色パターン別でカラーチャートを見ることができます。 配色パターンごとにすぐに見れるので決まったカラーがあるとき、役に立ちます。

2017-18の秋冬ファショントレンドカラー

上記は配色ルールを見ていきましたが、カラー選択やアイディア出しの時には他の方面からヒントを得たりするのも一つの手です。 そこで、一例として「カラー」をファッションのトレンドから見ていきたいと思います。 2017-18秋冬のトレンドが上がっているのでご紹介します。今期のイメージは比較的寒色系が多く、クールなイメージが強いようです。

1.ネイビー

差し色を加えるもよし、ドミナントカラーで統一させたイメージを持つのもよし、全体的にシックで上品なイメージに仕上がります。

navy

2.グレー

ベーシックなグレーカラーが注目されています。 グレーの中で黒~白のバランスをとり、全体的にまとまった印象付けをします。 また、落ち着いたカラーで邪魔をすることなく、引き締まったイメージを与えます。

gray

3.アースカラー(カーキ・茶系)

ナチュラルなイメージ付けができます。 また、黄色系がかった色であれば少しの温かみ、緑色系であれば草花などをイメージするオーガニックな印象を与えます。

earthcolor

4.レッド

春夏からの人気が継続しているレッド。 ビビットなカラーをアクセントとして取り入れるのに最適なカラーです。 差し色があるだけで、引き締まったイメージを与えることができます。

red

まとめ

カラーの配色ルール・チャート・ファッショントレンドカラーを見ていきましたが、いかがだったでしょうか。 「色」ひとつで簡単にイメージは変わっていきます。 印象付けたいイメージがあればあるほど色にこだわってデザインされていることだと思います。 制作物を作り続けると、色の選択はだんだんと感覚的になってきてしまいます。 その感覚的なものはしっかりとした実践で身についた知識やパターンに基づいたものだとは思うのですが、たまに基本に立ち返ってみると新たなイメージを見つけることができるかもしれません。

ご覧いただきありがとうございました。少しでもご参考になればと思います。

著者:MainYard Design(メーンヤードデザイン)
北野敦子

kitano
1987年大阪出身。
生活する上で必ず目にするデザインされたものたち。
街を歩くだけでも無限の魅力があふれています。
ある日ふとそれらに魅了され別業界からデザイナーへ転身。
関西を中心にグラフィックデザインからブランド戦略提案などを展開中。
2012年タイポグラフィ作品展「OKU-2」出展。第31回読売広告大賞協賛社賞受賞。


CATEGORY:

さあ、KOBITをスタートしよう。