Simultaneous Contrast
明度対比の錯視 — 2026, generated SVG, dimensions variable · Luminance · Interactive
After Michel Eugène Chevreul, 1839
Two greys, or one?
2つの四角、明るいのはどっち?
見るコツ: 2つの四角の境目あたりだけを見てください
共有する
答えを見る
2つの四角はまったく同じグレー(#8a8a8a)です
↑ 仕掛けを可視化した状態
Notes — なぜそう見える?
何が起きているのか
2つの四角は同じ1つの色コードで塗られています。 「答えを見る」を押すと、同じ色の帯が2つの四角をつなぎます。帯が途切れずに一続きに見えたら、それが同じ色である証拠です。
なぜそう見えるのか
網膜から先の視覚系は、光の絶対量ではなく隣り合う領域の差を強調して送ります(側抑制)。 これは照明が変わっても物の色を同じと判断するための仕組みで、日常ではほぼ常に正しく働きます。
- 曇りの日でも晴れの日でも、白い紙は白く見える
- 影に入っても、りんごは赤いままに見える
つまりこれは脳のバグではなく、照明の違いを打ち消すための機能が、意図的に作った場面で裏目に出ている状態です。
デザインでの意味
同じ色指定でも、背景が変われば見え方は変わります。 UI のグレーやテキスト色を決めるとき、単体で見て決めると本番の背景の上で印象が変わるのはこのためです。
この錯視の初出
After Michel Eugène Chevreul, 1839
原典: 『De la loi du contraste simultané des couleurs』(色の同時対比の法則)
Media — 画像素材とデータ
- OGP / X(1200×630)
- Instagram 正方形(1080×1080)
- Shorts / Reels 縦(1080×1920)
- 答え合わせ画像・横長(X の 2 枚目)
- 答え合わせ画像・正方形(Instagram の 2 枚目)
- 答え合わせ画像・縦(Shorts の答え)
- SNS 投稿文データ(JSON)
授業・自由研究・ブログなど、非商用なら画像を自由に使えます。出典としてこのページへのリンクを付けてください。商用での利用は対象外です
図版は現象の原理から本サイトで生成しています(自前で再実装)。同時明度対比(simultaneous contrast)として古くから知られる現象。図版は色値をパラメータとして自前生成している。


