Infinity-Agent Lab
マーケティング
中級者以上の教科書
お取り引き企業

【図解】色相環とは?補色や反対色ってなに?

更新日:2024年11月18日

【図解】色相環とは?補色や反対色ってなに?
配色のパターンに様々な理論があるのはご存知でしょうか?理論に基づくことでデザイナー以外の方もスムーズに配色をすることができます。

今回は、様々な理論の中から基本的なものを紹介します!

色相環とは?


色相環とは、名前の通り色相を環状(輪状)に配置したもので、色を体系化するときに用いる方法のひとつです。

色は光の波長の違いによって赤、橙、黄、緑、青、紫というように連続的に変化し知覚されます。
これを連続的に円環状にしたものを色相環というのです。

色相環は、規則的に色を並べた表色系を表すことができます。

表色系は主に以下の3種類があります。

◎マンセル表色系 
(アメリカの画家であるマンセルが創案)
◎オストワルト表色系
(ノーベル化学賞受賞ドイツのオストワルトが創案)
◎PCCS
(日本色配色体系)

下記で詳しく解説していきます。

マンセル表色系

画像引用:色相環|武蔵野美術大学

マンセル表色系は、赤・黄・緑・青・紫の5色を基準としています。
加えて、それぞれの中間色相である、赤黄・黄緑・青緑・青紫・赤紫を加えた10色で示されています。

国際的に使われている色相環です。

オストワルト表色系

画像引用:色相環|武蔵野美術大学

オストワルト表色系は、赤と緑・黄と青の2つの反対色を対に配置し、それぞれの間に橙・紫・青緑・黄緑を配置しています。
さらにそれを3分割することで、合計24色で構成されている色相環です。

PCCS

画像引用:色相環|武蔵野美術大学

赤・黄・緑・青の4色を基準としており、それぞれの対の位置に心理補色を配置します。
さらにそれぞれの色の間に4色配置し、それを2分割することで、合計24色で構成される色相環です。

基本の配色5選

基本の配色について、以下の5つを紹介していきます。

◎ダイアード配色
◎モノトーン配色
◎グラデーション配色
◎ドライアド配色
◎テトラード配色

ダイアード配色(補色)

色相環の反対側にある色を組み合わせる方法 です。

赤と緑、紫と黄色など、互いの色を目立たせたいときに利用します。コンプメンタリー配色とも言います。

モノトーン配色

同じ色相の明度違いの色で組み回せることで、統一感を出せる配色方法です。まとまりが出やすいので使いやすい配色です。

グラデーション配色

色相が近いものを組み合わせる配色方法です。

色相環が近いもの、同じ色相で明度や彩度でグラデーションにする方法です。幅広い使い方ができます。

トライアド配色

色相環を正三角形で位置した色で配色する方法です。

バランスが良く、トーンによって賑やかな印象になったり、落ち着いた印象にもなります。

テトラード配色

色相環を正方形で4等分した位置にある色で配色する方法です。カラフルな印象になります。

カラーパレットサイト



カラーパレットサイトについて、以下の3つを紹介していきます。

◎adobe color cc
◎colordrop
◎colorkitty

adobe color cc

デバイスで撮影した写真を元にカラーパレットを作成したり、IllustratorやPhotoshopなど、Adobeのサービスと同期利用することができるアプリツールです。

参考:adobe color cc

colordrop

4色のカラーパレットを掲載しているサイトです。カラーのクリックでRGBと16進数で

参考:colordrop

colorkitty

画像をアップロードすることで色を自動で抽出し、カラーパレットを作成してくれるツールです。

参考:colorkitty

まとめ

いかがでしたか?

配色には他にも様々なパターンがあり、色相環での色の位置関係で様々な組み合わせができます。また、配色が苦手な方でも理論的に配色を行うことでバランスを整えることができます。多くの色を使う場合でも安心して配色を行う場合などに役立てましょう。

弊社でも、市場を理解したクリエイティブ提案を行なっております。一緒に課題解決をしてくれるパートナーを探している方は、ぜひ一度ご相談ください

この記事を書いた人

「挑戦できる環境」であることを理由に入社を決意。ハマると集めてしまう収集癖があります。特技は服をたたむこと!元広告運用を行っていた経験を活かしながらIAラボの編集長を務めています。

Category  / 目的のカテゴリから読みたい記事をチェック!

Return Top