「同じ色なのに、違う色に見える」
「同じ大きさなのに、片方が大きく見える」
「本当は動いていないのに、動いているように見える」
私たちの目には、このような不思議な現象が起こることがあります。
これは、目に入ってきた情報をそのまま見ているのではなく、周囲の色や明るさ、形、配置などの情報と合わせて脳が判断しているからです。
こうした現象は、一般的に「目の錯覚」や「錯視」と呼ばれています。
特に色については、さまざまな現象があります。
この記事では、色を中心に、デザインにも活用できる代表的な錯覚・錯視を図解で紹介します。
▶ 色の三属性とは?色相・明度・彩度をわかりやすく解説
▶ 色の対比とは?色が違って見える現象を図解で解説
色の錯覚とは?

色の錯覚とは、実際の色そのものとは違った色や明るさ、鮮やかさなどに感じる現象を指すときに使われる言葉です。
ただし、色の見え方が変化する現象には、「色の対比」のように、周囲の色との関係によって起こるものもあります。
そのため、以下のように大まかに分けて考えると分かりやすいでしょう。
| 色の対比 | 周囲の色との関係によって見え方が変わる現象 |
| 錯視・錯覚 | 実際の刺激とは異なるように知覚される現象 |
「色の対比」については、こちらの記事で詳しく解説しています。

なぜ目の錯覚が起こるの?

私たちは、目に入ってきた光や色を、そのまま機械的に見ているわけではありません。
周囲にある色や明るさ、形、遠近感などの情報を合わせて、脳が「これはこういう色・形・大きさだろう」と判断しています。
そのため、同じ色や同じ大きさでも、周囲の環境が変わると違って感じることがあります。
例えば、同じグレーでも、
白い背景 → 暗く感じる
黒い背景 → 明るく感じる
ということがあります。
これは、前の記事で紹介した「明度対比」の代表的な例です。
つまり、色を見るときには、色そのもの+周囲の環境が一緒に影響していると考えると分かりやすいでしょう。
① 同じ色なのに違って見える「色の錯視」
まずは、一番分かりやすい例から見てみましょう。
中央にまったく同じグレーを2つ置きます。

すると、左のグレーは暗く、右のグレーは明るく感じられます。
でも、中央のグレーのカラーコードはまったく同じです。
このような現象には、周囲の色の影響が関係しています。
詳しくは「色の対比」の記事で解説しています。

② 周囲の色で色味まで変わって見える
色の錯覚は、明るさだけではありません。
周囲の色によって、中央の色が少し違った色味に感じられることもあります。
例えば、同じグレーを、赤系の背景と青系の背景に置いてみます。

すると、中央のグレーにわずかに色味があるように感じることがあります。
このように、色は単独ではなく、周囲との関係によって見え方が変わることがあります。
③ 色の錯覚を利用した「残像」
色の錯覚には、残像と呼ばれる現象もあります。
ある色をしばらく見つめたあと、白い背景などに視線を移すと、元の色とは違う色が見えることがあります。
これは、見ていた色の影響が一時的に残ることで起こる現象です。
まず、次の画像の赤い円を10〜20秒ほど見つめてください。
このとき、できるだけ円の中心を見て、次に、右の白い画面へ視線を移してみてください。

すると、緑〜青緑のような残像が見えることがあります。
これは、赤と緑が補色関係にあるためです。
ただし、残像の見え方には個人差があります。
④ 同じ大きさなのに違って見える 大きさの錯視「エビングハウス錯視」
錯視は、色だけでなく大きさにも起こります。
同じ大きさの円でも、小さな円に囲まれている円と大きな円に囲まれている円では、中央の円の大きさが違って見えることがあります。
代表的な例が、エビングハウス錯視です。

これは「周囲との比較によって、対象の大きさの感じ方が変化する」代表的な錯視です。
⑤ 色によって大きさが違って見える「膨張色」と「収縮色」
色そのものによっても、大きさや広がりの感じ方が変わることがあります。
例えば、一般的に、明るい色・白などは、暗い色に比べて大きく広がって見えやすい傾向があります。
反対に、黒などの暗い色は、引き締まって小さく見えやすい傾向があります。
これをデザインやファッションでは、「膨張色」「収縮色」と呼ぶことがあります。

膨張色・収縮色は色の見え方の傾向を表したものです。
実際の印象は、色相・彩度・背景・面積などによっても変わります。
ファッションの場合は、服の形・素材・柄・明暗・周囲の色など、さまざまな条件によって見え方が変わります。
そのため、「白なら必ず太って見える」「黒なら必ず細く見える」という単純な話ではありません。
⑥ 暖色と寒色で距離感が違って見える「進出色」と「後退色」
色によって、前に出て見えたり、奥に引いて見えたりすることもあります。
一般的に、赤・オレンジ・黄色などの暖色は、近くに感じられやすく、
青・青緑などの寒色は、遠くに感じられやすい傾向があります。
これを、「進出色」「後退色」と呼ぶことがあります。

一般的に、
暖色 → 前に出て見えやすい
寒色 → 奥に引いて見えやすい
という傾向があります。
進出色・後退色は、色による距離感の見え方の傾向を表したものです。
実際の見え方は、色相だけで決まるものではなく、明度・彩度・背景色などによっても変わります。
⑦ 同じ色でも面積によって印象が変わる
色を見るときには、色の面積も重要です。
小さな面積で見たときと、部屋の壁など大きな面積で使ったときでは、色の印象が違って感じられることがあります。
例えば、同じベージュでも、小さな色見本では「ちょうどいい」と感じたのに、壁全体に使うと「思ったより黄色っぽい」と感じることがあります。
これは、色を使う面積が変わることで、色の印象を強く感じやすくなるためです。

同じ色を使っても、使う面積が変わることで、明るさや存在感の感じ方が変わります。
色を選ぶときは、実際に使う面積をイメージすることが大切です。
デザインで色の錯覚を活かすには?
色の錯覚や錯視は、デザインにも活用できます。
Webデザイン
背景色と文字色の関係によって、文字の明るさや見やすさが変わります。
例えば、同じグレーの文字でも、白背景と濃い背景では見え方が大きく変わります。
そのため、「カラーコードだけを見る」のではなく、実際のデザイン上で確認することが大切です。
バナー・広告
目立たせたい部分に、背景とは異なる色を使うことで、視線を集めることができます。
補色に近い色をポイントとして使うのも一つの方法です。
ただし、強い色を多用すると、かえって見づらくなる場合があります。
ファッション
色の明るさや色相によって、服の大きさや体のライン、距離感などの印象が変わることがあります。
例えば、
明るい色 → 軽やか・広がって見えやすい
暗い色 → 引き締まって見えやすい
といった傾向があります。
ただし、服のシルエットや素材、柄なども大きく影響します。
インテリア
壁や家具など広い面積に使う色は、面積が大きい分、色の印象も強くなります。
小さな色見本だけで判断せず、実際の部屋でどのくらいの面積に使うのかを考えることが大切です。
色の錯覚を知ると、色選びがもっと面白くなる
色の錯覚を知ると、
「なんとなくこの色が違って見える」
という感覚を、少し理論的に考えられるようになります。
例えば、
「このグレー、Web上ではちょうどいいのに背景を変えたら暗く見える」
「小さな色見本ではきれいだったのに、壁一面にすると印象が違う」
「同じ大きさの図形なのに、周りの形によって違って見える」
こうした現象は、色や形を単独で見るのではなく、周囲との関係の中で見ているからこそ起こります。
デザインでは、この「見え方のズレ」を避けるだけでなく、逆に利用することもできます。
よくある質問(FAQ)
- Q色の錯覚とは簡単にいうと何ですか?
- A
実際の色や明るさとは異なるように感じたり、周囲の色や環境によって色の見え方が変化したりする現象です。
- Q同じ色なのに違って見えるのはなぜですか?
- A
周囲の色や明るさなどの影響を受けて、脳が色を相対的に判断するためです。
- Q色の対比と色の錯覚は同じですか?
- A
完全に同じ意味ではありません。
色の対比は、周囲の色との関係によって色の見え方が変化する現象の一つです。
「錯視」はより広く、色だけでなく大きさ・形・位置・動きなどに関する視覚現象も含みます。
- Q白は本当に膨張して見えますか?
- A
白などの明るい色は、黒などの暗い色に比べて大きく広がって見えやすい傾向があります。
ただし、服の形や素材、柄などによって見え方は変わるため、色だけで大きさが決まるわけではありません。
- Q暖色は本当に近く見えますか?
- A
赤やオレンジなどの暖色は、青などの寒色よりも近く感じられやすい傾向があります。
ただし、これも明度や彩度、背景などによって変わります。
- Q色の錯覚はデザインにも使えますか?
- A
はい。文字を目立たせたり、空間の広さや奥行きを演出したり、ファッションで印象を変えたりするなど、さまざまな場面で活用できます。
関連記事
まとめ
色の錯覚や錯視は、実際の色や大きさと、私たちが感じる見え方が異なる現象です。
代表的なものには、
などがあります。
私たちは色や形を単独で見ているのではなく、周囲の情報と合わせて判断しています。
だからこそ、同じカラーコードでも、置く場所によって違って見えることがあります。
色選びをするときは、色そのものだけでなく、
「どんな背景に置く?」
「どのくらいの面積で使う?」
「周囲にはどんな色がある?」
まで考えてみると、よりイメージに近い配色を作りやすくなります。


コメント