edubun
한국어
English한국어EspañolPortuguêsFrançaisDeutschItalianoNederlandsРусскийBahasa Indonesia日本語
홈›색·디자인›색 이론

색은 어떻게 보일까

망막에는 원뿔세포가 약 600만 개 있는데 종류는 세 가지뿐이고, 우리가 본 모든 색은 이 세 종류가 얼마나 세게 반응했는지의 조합입니다.

3D 모형을 불러오는 중

끌어서 돌리고, 휠이나 두 손가락으로 확대하세요.

빨강, 초록, 파랑의 이상적인 빛 세 개가 어두운 벽을 비춥니다. 슬라이더로 빛 하나를 어둡게 하면 겹친 부분의 색이 바뀝니다. 아래 칸에 영역마다 색을 16진수 코드로 적어 둡니다.

색은 빛에서 시작합니다

빨간 사과 속에 빨강이 들어 있는 것은 아닙니다. 사과에 닿는 햇빛에는 400 nm 근처의 보라부터 700 nm 근처의 진한 빨강까지 보이는 파장이 모두 들어 있습니다. 사과 껍질은 짧은 파장과 중간 파장을 대부분 흡수하고 긴 파장을 되돌려 보냅니다. 그 긴 파장이 눈에 들어오면 뇌가 그것을 빨강이라고 부릅니다. 빛이 바뀌면 색도 바뀝니다. 파란빛만 나오는 등 아래에서는 같은 사과가 거의 검게 보입니다. 되돌려 보낼 긴 파장의 빛이 없기 때문입니다.

W3C의 CSS Color 명세는 이것을 조심스럽게 정리합니다. 물체의 색은 파장마다 빛을 얼마나 반사하는지, 그리고 그 물체를 비추는 빛이 어떤지에 따라 정해집니다. 화면처럼 스스로 빛을 내는 것의 색은 파장마다 빛을 얼마나 내는지에 따라 정해집니다. 스펙트럼이 서로 다른 두 물체도 똑같아 보일 수 있고, 그럴 때 우리는 둘의 색이 같다고 말합니다.

원뿔세포는 세 종류입니다

OpenStax 대학 물리 교재는 사람 망막의 원뿔세포를 약 600만 개로 셉니다. 종류는 세 가지이고, 종류마다 가장 잘 반응하는 파장 범위가 다릅니다. 하나는 긴 파장(붉은빛), 하나는 중간 파장(초록빛), 하나는 짧은 파장(푸른빛)에 가장 민감합니다. 원뿔세포 하나만으로는 자기가 본 것의 색을 알 수 없습니다. 빛알을 얼마나 받았는지만 알려 줍니다. 세 종류의 반응을 뇌가 나란히 비교할 때 비로소 색이 생깁니다.

그래서 노란빛과, 빨간빛과 초록빛을 섞은 빛이 똑같아 보일 수 있습니다. 순수한 노란빛은 긴 파장 원뿔세포와 중간 파장 원뿔세포를 거의 같은 세기로 자극합니다. 같은 자리에 빨간빛과 초록빛을 함께 비춰도 마찬가지입니다. 원뿔세포가 보내는 신호가 같으니 뇌는 같은 노랑을 봅니다. OpenStax는 세 원색의 조합이 하나로 정해져 있지 않다는 점도 짚습니다. 다른 조합으로도 됩니다. 빨강, 초록, 파랑은 각각 주로 한 종류의 원뿔세포를 움직이기 때문에 화면에 쓰기 편한 조합일 뿐입니다.

배경1660년대에 아이작 뉴턴은 어두운 방에서 햇빛을 유리 프리즘에 통과시키기 시작했습니다. 그는 흰빛이 여러 색의 띠로 이루어져 있고, 그 색을 두 번째 프리즘으로는 더 나눌 수 없다는 것을 보였습니다. 이 연구는 1704년 『광학(Opticks)』으로 나왔습니다. 같은 책에서 뉴턴은 색의 띠를 둥글게 구부려 원을 만들고, 둘레를 음계의 비율에 맞춰 일곱 부분으로 나눈 뒤 가운데에 흰색을 두었습니다. 이 그림은 가장 오래된 색상환 가운데 하나이고, 이 과정에 나오는 색상환은 모두 여기서 이어집니다.

화면은 이것을 이렇게 씁니다

휴대폰 화면을 돋보기로 보면 아주 작은 빨강, 초록, 파랑 소자가 보입니다. 화면은 노란빛을 직접 만들지 않습니다. 빨강 소자와 초록 소자를 나란히 켜는데, 너무 작아서 따로 보이지 않으니 긴 파장 원뿔세포와 중간 파장 원뿔세포가 노란빛을 볼 때처럼 반응합니다. 셋을 모두 켜면 흰색이 보입니다. 셋을 모두 끄면 검정, 정확히는 화면의 어두운 유리가 보입니다. 위 모형에서도 세 빛이 모두 겹치는 가운데는 흰색이고, 두 빛이 겹친 곳은 어느 한 빛보다 밝은 색이 됩니다. 빛을 섞는 규칙은 이것입니다. 빛을 더하면 결과는 언제나 더 밝아집니다.

원뿔세포가 보내는 신호를 숫자 세 개로 나타낼 수 있으니, 화면 위의 색도 숫자 세 개로 나타낼 수 있습니다. 이 과정의 나머지는 이 세 숫자를 다룹니다. 숫자를 돌려 볼 수 있는 입체로 늘어놓는 법, 서로 어울리는 색을 고르는 법, 그리고 색이 배경 위에서 읽히는지 확인하는 법입니다.

  • 1660년대: 뉴턴이 프리즘으로 햇빛을 나눕니다.
  • 1704년: 일곱 부분으로 나눈 색상환이 실린 『광학』이 나옵니다.
  • 1722년경: 르 블롱이 『콜로리토』에서 세 가지 색 인쇄를 설명합니다.
  • 1861년: 맥스웰이 필터를 끼운 사진 세 장으로 만든 컬러 사진을 보여 줍니다.
  • 2018년: WCAG 2.1이 W3C 권고안이 됩니다.
핵심 정리
  • 물체는 일부 파장을 반사하고 화면은 빛을 냅니다. 어느 쪽이든 눈에는 스펙트럼으로 들어옵니다.
  • 망막에는 세 종류의 원뿔세포가 약 600만 개 있습니다.
  • 스펙트럼이 달라도 원뿔세포를 똑같이 자극하면 같은 색으로 보입니다.
  • 화면은 빨강, 초록, 파랑 빛을 섞고, 셋 다 최대이면 흰색으로 보입니다.
  1. 햇빛 아래에서 빨간 사과가 빨갛게 보이는 까닭은?
    • 주로 긴 파장을 반사해서
    • 스스로 빨간빛을 내서
    • 빨간빛을 흡수해서
    • 햇빛이 빨개서
  2. OpenStax에 따르면 사람 망막의 원뿔세포는 약 몇백만 개입니까?
  3. 보통 사람 눈의 원뿔세포는 몇 종류입니까?
  4. 흰 벽에 빨간빛과 초록빛이 겹쳤습니다. 무슨 색으로 보입니까?
    • 노랑
    • 갈색
    • 파랑
    • 검정
  5. 빨강, 초록, 파랑 빛을 모두 최대로 같은 곳에 비추면?
    • 흰색
    • 검정
    • 회갈색
    • 보라
  6. 사과를 순수한 파란빛 등으로만 비추면 어떻게 보입니까?
    • 아주 어둡게, 거의 검게
    • 밝은 빨강
    • 보라
    • 노랑
  7. 스펙트럼은 다른데 똑같아 보이는 두 빛을 CSS Color 4는 어떻게 봅니까?
    • 색이 같다
    • 하나가 잘못됐다
    • 있을 수 없다
    • 색이 다르다
  8. 뉴턴의 『광학』이 나온 해는?
  9. 뉴턴은 색상환의 둘레를 몇 부분으로 나눴습니까?
    • 7
    • 3
    • 12
    • 6
  10. 화면이 빨강, 초록, 파랑을 원색으로 쓰는 까닭은?
    • 각각 주로 한 종류의 원뿔세포를 움직여서
    • 가능한 원색이 이것뿐이라서
    • 가장 싼 염료라서
    • 뉴턴이 골라서
이 과정의 출처 (14)
  • W3C, Web Content Accessibility Guidelines (WCAG) 2.2, relative luminance (0.04045 threshold, note on the pre-May-2021 value 0.03928)
  • contrast ratio (L1 + 0.05) / (L2 + 0.05)
  • range 1:1 to 21:1, SC 1.4.1 Use of Color, 1.4.3 Contrast (Minimum) 4.5:1 and 3:1 for large-scale text (18 pt, or 14 pt bold)
  • 1.4.6 Contrast (Enhanced) 7:1 and 4.5:1, 1.4.11 Non-text Contrast 3:1, WCAG 2.1 published June 2018 (w3.org/TR/WCAG22/)
  • W3C, CSS Color Module Level 4, hex notation, hsl with 0deg red, 120deg green, 240deg blue, hsl(60deg 100% 50%) yellow vs hsl(240deg 100% 50%) blue at the same HSL lightness, hue spacing not perceptually uniform, HSL as a cylindrical model (w3.org/TR/css-color-4/)
  • OpenStax College Physics 2e, 26.3 Color and Color Vision: about 6 million cones of three types, red + green gives yellow, no unique set of primaries (openstax.org/books/college-physics-2e/pages/26-3-color-and-color-vision)
  • OpenStax Introduction to Behavioral Neuroscience, 6.2 The Retina: RGB pixels, CMY inks plus black, red-green colour blindness in about 8% of males (openstax.org/books/introduction-behavioral-neuroscience/pages/6-2-the-retina)
  • Smithsonian Libraries, Color in a New Light, The Science of Color: Newton's prism experiments from the 1660s, Opticks 1704, Le Blon's Coloritto (London, about 1722) and the distinction between material colours and coloured light (library.si.edu/exhibition/color-in-a-new-light/science)
  • The Newton Project (University of Oxford)
  • Opticks 1704, Book I Part II Prop. VI: colour circle divided into seven parts in musical proportion, white at the centre (newtonproject.ox.ac.uk/view/texts/normalized/NATP00034)
  • History of Information and Wikimedia Commons file record, Maxwell's 1861 Royal Institution demonstration, tartan ribbon photographed by Thomas Sutton through red, green and blue filters and projected together (historyofinformation.com/detail.php?id=3666)
  • LibreTexts, Coalinga College Drawing Basics 8.4 Color Theory: complementary, analogous, split-complementary, triadic, tetradic (human.libretexts.org)
  • RMIT Colour Theory, Interactive colour wheel and colour relationships (rmit.pressbooks.pub/colourtheory1)
  • University of Delaware Library, Graphic Design guide, Color Schemes, 60/30/10 rule (guides.lib.udel.edu/design/color).

확인한 날: 2026-10-17