ビビッドカラー・パステルカラー・くすみカラーなど、色にはさまざまな表現があります。
でも、
「ビビッドとブライトは何が違うの？」
「パステルカラーはPCCSではどのトーン？」
「くすみカラーって、どのトーンのこと？」
と疑問に思ったことはありませんか？
そんなときに役立つのが、トーンという考え方です。
トーンとは、簡単にいうと、色の明るさや鮮やかさをまとめて表した「色の調子」のこと。
PCCS（日本色研配色体系）では、有彩色を12のトーンに分類しています。
この記事では、PCCSの12トーンを一覧で紹介しながら、それぞれの特徴やイメージをわかりやすく解説します。
「色の名前は分かるけれど、色の印象をどう整理したらいいか分からない」という方にもおすすめです。
▶ 色の三属性とは？色相・明度・彩度をわかりやすく解説
▶ 色相環とは？12色・24色の違いや補色・類似色・反対色をわかりやすく解説
- トーンとは？
- PCCSとは？
- PCCSの12トーン一覧
- 無彩色にもトーンはある？
- トーンの色調域
- ① ビビッドトーン（v）
- ② ブライトトーン（b）
- ③ ストロングトーン（s）
- ④ ディープトーン（dp）
- ⑤ ライトトーン（lt）
- ⑥ ソフトトーン（sf）
- ⑦ ダルトーン（d）
- ⑧ ダークトーン（dk）
- ⑨ ペールトーン（p）
- ⑩ ライトグレイッシュトーン（ltg）
- ⑪ グレイッシュトーン（g）
- ⑫ ダークグレイッシュトーン（dkg）
- 同じ色相でもトーンが変わると印象が変わる
- 同じトーンで色相を変えると統一感が出る
- トーンを使うと配色が考えやすくなる
- トーンと「パステルカラー」「くすみカラー」は同じ？
- よくある質問（FAQ）
- 関連記事
- まとめ
- 参考サイト
トーンとは？
トーンとは、明度と彩度を組み合わせて、色をグループ分けしたものです。
明度は「明るさ」、彩度は「鮮やかさ」を表します。
この2つを組み合わせることで、色の特徴をまとめて捉えることができます。
例えば同じ「赤」でも、
というように、トーンによって印象が大きく変わります。
PCCSとは？
ここで、トーンを理解するうえで重要なPCCSについて簡単に説明しておきましょう。
PCCSは、「Practical Color Co-ordinate System」の略で、日本語では日本色研配色体系と呼ばれます。
色彩検定でも扱われる、日本の代表的なカラーシステムのひとつです。
PCCSでは、色相とトーンの2つの軸を使って色を整理します。
PCCSでは、
という形で色を整理できます。
つまり、
色相で「何色か」を表し、トーンで「どんな調子の色か」を表す
と考えると分かりやすいでしょう。
PCCSの12トーン一覧
PCCSの有彩色は、12のトーンに分類されています。
| トーン | 記号 | イメージ |
|---|---|---|
| ■ ビビッド | v | 鮮やかな・冴えた |
| ■ ブライト | b | 明るい・華やかな |
| ■ ストロング | s | 強い・力強い |
| ■ ディープ | dp | 深い・濃い |
| ■ ライト | lt | 浅い・明るい |
| ■ ソフト | sf | 柔らかい・穏やかな |
| ■ ダル | d | 鈍い・くすんだ |
| ■ ダーク | dk | 暗い・大人っぽい |
| ■ ペール | p | 薄い・淡い |
| ■ ライトグレイッシュ | ltg | 明るい灰みの・落ち着いた |
| ■ グレイッシュ | g | 灰みの・地味な |
| ■ ダークグレイッシュ | dkg | 暗い灰みの・重い |
PCCSの12トーンには、それぞれ「さえた」「明るい」「強い」「濃い」などの形容詞が設定されています。
12トーンは、名前だけを覚えるよりも、明度と彩度の位置関係で見ると理解しやすくなります。
PCCSでは、明度と彩度の組み合わせによって12のトーンが分類されています。
この図を見れば、
という関係が一目で分かります。
無彩色にもトーンはある？
PCCSでは、有彩色の12トーンとは別に、無彩色を5段階に分類しています。
| トーン | 記号 | イメージ |
|---|---|---|
| □ ホワイト | W | 白 |
| ■ ライトグレイ | ltGy | 明るい灰色 |
| ■ ミディアムグレイ | mGy | 灰色 |
| ■ ダークグレイ | dkGy | 暗い灰色 |
| ■ ブラック | Bk | 黒 |
無彩色は色相と彩度を持たないため、12トーンとは別に扱われます。
トーンの色調域
トーンは色の配合の度合いによって以下のように大きく分類されます。
純色
「純色」は無彩色が混じってない色のことで、最も彩度の高い色です。
鮮やかで派手な印象になります。
明清色
「明清色」は純色に白を混ぜた色のことで、明度が高い色です。
明るく、さわやかな印象になります。
暗清色
「暗清色」は純色に黒を混ぜた色のことで、明度が低い色になります。
暗く、重い印象になります。
「明清色」と「暗清色」は、まとめて「清色」と呼ばれます。
中間色（濁色）
「中間色」は純色に灰を混ぜた色のことで、濁った色です。
やわらかく、落ち着いた印象になります。
① ビビッドトーン（v）
ビビッドトーンは、最も鮮やかな色のグループです。
PCCSでは、各色相の中でも特に彩度が高い「純色」にあたります。
ポップで元気なデザインや、目立たせたいアクセントカラーなどに向いています。
② ブライトトーン（b）
ブライトトーンは、明るく、華やかな印象のトーンです。
ビビッドほど強烈ではありませんが、明るさがあり、元気で陽気な雰囲気をつくります。
ファッションや子ども向けデザイン、明るく親しみやすいWebデザインなどにも使いやすいトーンです。
③ ストロングトーン（s）
ストロングトーンは、強く、力強い印象を持つトーンです。
ビビッドほど鮮やかではありませんが、しっかりとした存在感があります。
スポーツやエンターテインメントなど、エネルギーを感じさせたいデザインにも向いています。
④ ディープトーン（dp）
ディープトーンは、深く濃い印象のトーンです。
暗さがありながらも、色みや鮮やかさを感じやすいのが特徴です。
高級感やクラシックな雰囲気を出したいときにも使いやすいトーンです。
⑤ ライトトーン（lt）
ライトトーンは、明るく、浅い印象のトーンです。
白を加えたような明るさを持ち、爽やかで軽やかな印象になります。
春らしいデザインや、爽やかなファッションなどにもよく合います。
⑥ ソフトトーン（sf）
ソフトトーンは、柔らかく穏やかな印象のトーンです。
鮮やかすぎず、暗すぎないため、やさしく落ち着いた雰囲気をつくりやすい色です。
ナチュラル系のデザインや、やさしい雰囲気のファッションにも使いやすいトーンです。
⑦ ダルトーン（d）
ダルトーンは、彩度が抑えられた、鈍くくすんだ印象のトーンです。
「くすみカラー」と呼ばれる色をイメージすると分かりやすいです。
ただし、「くすみカラー＝必ずダルトーン」という意味ではありません。
⑧ ダークトーン（dk）
ダークトーンは、暗く落ち着いた印象のトーンです。
ファッションなら秋冬コーデ、Webデザインなら高級感のあるブランドサイトなどにも使いやすいトーンです。
⑨ ペールトーン（p）
ペールトーンは、非常に淡く、薄い印象のトーンです。
白を多く含んだような色で、やさしく軽やかな雰囲気があります。
ベビー用品や女性向けデザイン、春らしい配色などにも使いやすい色です。
⑩ ライトグレイッシュトーン（ltg）
ライトグレイッシュトーンは、明るさを残しながら、灰みを含んだ落ち着いたトーンです。
インテリアやファッションでも人気の高い、いわゆる「大人っぽいくすみカラー」に近い印象を持ちます。
⑪ グレイッシュトーン（g）
グレイッシュトーンは、灰みが強く、落ち着いた印象のトーンです。
彩度が低いため、色の主張を抑えたいときにも向いています。
⑫ ダークグレイッシュトーン（dkg）
ダークグレイッシュトーンは、暗さと灰みを持った、重厚なトーンです。
ブラックほど無彩色にはならず、色みを残しながら暗く落ち着いた印象をつくれます。
同じ色相でもトーンが変わると印象が変わる
ここが、トーンを学ぶ一番面白いところです。
例えば同じ「赤」でも、
というように、トーンによって印象が大きく変わります。
同じトーンで色相を変えると統一感が出る
トーンのもう一つの便利なところは、色相が違っても同じトーンを選ぶことで、色の調子をそろえやすいことです。
例えば、ビビッドトーンで組み合わせると、色相は違っても「鮮やかで元気」という共通した印象を作れます。
ビビッドレッド
ビビッドブルー
ビビッドイエロー
反対に、ペールトーンなら、淡くやさしい雰囲気でまとめられます。
ペールピンク
ペールブルー
ペールイエロー
トーンを使うと配色が考えやすくなる
トーンを知っていると、「何色と何色を組み合わせるか」だけではなく、
「どんな調子の色でまとめるか」という視点から配色を考えられます。
こんな風に、目的に合わせてトーンを選べます。
これはWebデザインだけでなく、ファッションやインテリア、イラストなどにも応用できます。
トーンと「パステルカラー」「くすみカラー」は同じ？
ここは混同しやすいポイント！
「パステルカラー」「くすみカラー」といった言葉は、日常的・デザイン的な表現として使われています。
一方、PCCSのトーンは色を体系的に分類するための考え方です。
そのため、
パステルカラー＝PCCSの○○トーンと完全に1対1で対応するわけではありません。
例えば「パステルカラー」は、一般的には淡く明るい色を指しますが、PCCSでは主にペールやライトなどのトーンが近いイメージになります。
「くすみカラー」も、ダル・ソフト・グレイッシュ・ライトグレイッシュなど、色によって近いトーンが変わります。
ここは、「一般的な色の呼び方」と「PCCSによる分類」は別物と覚えておくと分かりやすいでしょう。
よくある質問（FAQ）
トーンとは簡単にいうと何ですか？
トーンとは、色の明度と彩度を組み合わせて表した「色の調子」です。
「明るい・暗い」「鮮やか・くすんだ」といった色の印象をまとめて捉えることができます。
PCCSのトーンはいくつありますか？
有彩色は12トーンに分類されています。
無彩色は、ホワイト・ライトグレイ・ミディアムグレイ・ダークグレイ・ブラックの5段階に分類されます。
ビビッドとブライトの違いは？
どちらも明るく鮮やかな印象がありますが、ビビッドは特に鮮やかで強い色、ブライトはビビッドより明るさを感じやすい色として捉えると分かりやすいでしょう。
パステルカラーは何トーンですか？
一般的な「パステルカラー」はPCCSの正式なトーン名ではありません。
色によって異なりますが、ペールやライトなどのトーンが近いイメージです。
くすみカラーは何トーンですか？
「くすみカラー」もPCCSの正式なトーン名ではありません。
色によって、ソフト・ダル・ライトグレイッシュ・グレイッシュなど、近いトーンが異なります。
関連記事
まとめ
トーンとは、色の明度と彩度を組み合わせて表した「色の調子」のことです。
PCCSでは、有彩色を次の12トーンに分類しています。
トーンを理解すると、「何色を使うか」だけでなく、「どんな雰囲気の色でまとめるか」
という視点から配色を考えられるようになります。
色相環と合わせて使えば、さらに配色の幅が広がります。
参考サイト
コメント