
Color: From Hex codes to Eyeballs - markdog12
http://jamie-wong.com/post/color/
======
seanalltogether
I've been trying to build my own mental model that's easy to visualize how
your eyes build color.

Imagine 3 people (r,g,b) standing across from each other playing a 3 way tug
of war with a bowling ball in the center. They each can feed on certain ranges
of radiation to help them pull the ball towards them, color is determined by
where the ball ends up. If red and green pull equally the ball moves sideways
out of the center to land on yellow.

Now take it one step further. The ball actually starts out in a deep pit, if
everyones only pulling a little bit the ball lifts up but stays in the center,
you have dark grey, if everyones pulling at their max, you get white. What
seemed like a flat plane tug of war is actually a 3 dimensional cone.

Now take it one step further. The retina is typically composed of 95% red and
green cells of various mixtures, and only 5% blue. That means the blue person
has a very short rope to work with compared to the others and is not able to
move the bowling ball into as many unique positions as the others.

If you are red green colorblind then you only have 2 people playing tug of
war. Your color model is now 2 dimensional. If you have tetrachromacy you have
another person playing and capable of placing the bowling ball into positions
not possible with just 3 people. Additionally there is no such thing as pure
green, because all radiation that green feeds on will also feed either red or
blue as well.

edit/ I forgot to add the rod cells, they are another "one step further". They
are one extra person but they stand directly over the bowling ball, only
capable of pulling upwards, but they are very weak and can't lift it very
high.

~~~
jacobolus
There are multiple levels of processing here, so this pure trichromatic model
turns out to be a somewhat misleading mental model to fix on. The signals from
three types of cone cells are processed immediately within the eye into 3
different signals, a lightness response (L + M), a yellow-blue response (L + M
– S), and a red-green response (L – M), before those combined signals go
through further processing. LMS signals per se don't get sent anywhere further
up the chain. If you are red-green colorblind that means you aren't getting
much if any useful signal from the L – M response, either because your 'L' and
'M' cones are too close together to meaningfully distinguish, or because you
are missing one of the two entirely.

[Calling the LMS cone types Short = 'blue', Medium = 'green', and Long = 'red'
creates a lot of confusion. Stick to long/medium/short labels. A statement
like 'there is no such thing as pure green' is nonsensical. As Newton figured
out, light rays themselves are not colored; color is a higher-level percept
constructed in the human brain. Green is no more or less 'pure' than blue or
orange or purple.

For that matter calling the RGB primaries 'red', 'green', and 'blue' causes
some confusion also, as these primaries are seen as an orangish red, a
yellowish green, and a purplish blue, nowhere near the 'unique hues' red,
green, or blue. E.g. the use of these names in named CSS colors, etc. is a
horrible human interface.]

If you are interested in the details, this is one of the better sources online
[http://handprint.com/HP/WCL/color2.html](http://handprint.com/HP/WCL/color2.html)
[I would refer you to books but those are hard to accessibly hyperlink].

As for rods, their response is pretty much ignored during the day. They are
much more sensitive, so start kicking in when the visual system adapts to very
low levels of light where the cone cells aren't getting much useful signal.

The article under discussion in this thread is full of technicalities, and in
a brief skim I didn't notice any obvious errors, but it ignores several of the
most important high-level features of human color perception – and gets a bit
confused about the relationship between color reproduction via additive RGB
displays, color measurement by instruments, and models of human vision – and
therefore isn't the most useful resource for someone new to the subject, IMO.

~~~
kurthr
Agreed, it's a lot of different sources of information. Color perception and
reproduction are deep subjects and many of the results/assumptions are in turn
subjective (e.g. dependent on the person). However, this is a lot better than
most of the simple presentations I've seen on-line.

One of the noticeable gaps in the article was a discussion of white-point or
color temperature even though it starts to discuss illumination. It's critical
to realize that our perception of color is influenced by the surroundings and
relative to what we accept as white. That's part of why when you're out in the
snow with rose glasses on things start to look normal, until you take them
off... also why people argue about the blue-black or gold-white dress.

------
neya
A couple of years ago, I built an app that would generate websites from
photographs. The idea was if you liked a particular scenery/color combination
from the real world, then you'd have a website built from it. All you had to
do was a take a photo and it'd generate a color palette from which the website
would be built on the fly.

However, I faced with the same challenge as the author has pointed out - what
our eyes see and perceive as "bright" are very totally different from what
computers perceive. So, I designed an algorithm from scratch using ML and the
HSV color model. The tests I ran showed me the real difference between what I
saw and what the computers saw.

Here's some samples:

1\. [https://i.imgur.com/jhWR3pq.jpg](https://i.imgur.com/jhWR3pq.jpg)

2\. [https://i.imgur.com/M6Oo6dp.jpg](https://i.imgur.com/M6Oo6dp.jpg)

I think I'll probably open source it soon.

~~~
pasta
There is also a very nice JS lib that does this:
[https://jariz.github.io/vibrant.js/](https://jariz.github.io/vibrant.js/)

------
danielvf
I write firmware for theater/TV LED lights. I have a spectrometer on my desk.

This is the guide I wish I had to get started with! It’s amazing!

~~~
justinpombrio
Here's another trove of information about color, if anyone finds it useful:

[http://www.handprint.com/LS/CVS/color.html](http://www.handprint.com/LS/CVS/color.html)

~~~
teddyh
See also the classic _Color FAQ_ :

[http://poynton.ca/ColorFAQ.html](http://poynton.ca/ColorFAQ.html)

------
hprotagonist
Color is way more fascinating than I had previously thought.

A few years ago, i watched this pydata talk on designing colormaps for
matplotlib that was pretty engrossing:
[https://www.youtube.com/watch?v=xAoljeRJ3lU](https://www.youtube.com/watch?v=xAoljeRJ3lU)

------
mark-r
Interesting tidbit about color blindness: it's often caused by the response of
the eye's M and L cones being too close together. There's a company that makes
glasses that put a notch in the frequency response between the two to produce
a more pronounced difference, allowing R-G color-blind individuals to
differentiate red and green for the first time.

[http://enchroma.com/](http://enchroma.com/)

~~~
ubernostrum
Deuteranomaly and protanomaly -- the most common conditions referred to as
"red-green colorblindness", and which involve variant forms of light-sensitive
pigment in one set of cones -- do _not_ involve inability to distinguish red
from green.

Deuteranomaly causes difficulty distinguishing between shades where the
precise _amount_ of green is relevant (i.e., to a deuteranomalous person, pure
yellow -- equal parts red and green -- would still look slightly reddish-
orangish).

Protanomaly causes a similar effect with red, and also dims the dark/deep red
part of the spectrum slightly.

If someone doesn't want to use the medical terms for them, better names are
"green weakness" and "red weakness" since they don't carry the misleading
"can't tell red and green apart" connotation.

~~~
mark-r
I apologize for my ignorance of the specifics of color blindness, I don't
suffer from it myself. I've just been so fascinated by the concept of these
glasses that I can't help sharing.

~~~
mclehman
There is also a very large range of responses to the EnChroma glasses. I've
seen or heard about plenty of intense reactions to them, but my personal
experience has not reflected that.

My brother-in-law and I are both colorblind (mine is not as severe as his) and
he bought a pair a few years ago. He enjoys the difference but not enough to
wear them consistently, and they had a barely perceptible effect on my own
vision, just giving green a bit more "pop".

I think the main issue is that it's easy to group all colorblindness together
even though "huh, I guess my shirt really is purple" is very different from "I
look at streetlight positions, not colors."

That said, even my mild colorblindness puts me at a massive disadvantage on
certain Halo maps or against certain team colors. In situations like that, I
might as well be fully colorblind asI end up having to play based on movement
alone.

~~~
mark-r
I always assumed the large range of responses was due to a large variation in
the way color blindness manifests. Also perhaps on how your neurons have
adapted to the condition; I wonder if age plays a role?

------
maxmcd
How can an image properly illustrate (in RGB) what colors are outside of the
RGB gamut? That image must be inaccurate? Should I assume the image is
technically incorrect but a good illustration of what the RGB gamut does look
like?

~~~
crazygringo
This (and every other gamut picture in existence) can't, which is why the
colors don't change any further outside the RGB triangle in these
illustrations online. (In CMYK print it's even worse.) You have to use your
imagination that the colors become even more intense.

A good parallel would be if you ever try to take a snapshot of a vivid sunset
on your phone, then compare the screen image with the sunset behind you. The
sunset's colors will be far more vivid, saturated, intense, than anything your
phone can display. Those are some of the colors outside the RGB gamut.

~~~
Firadeoclus
The closest comparison would be to try to match the colours of the sunset with
a paint app on your phone.

The phone's camera has its own limitations which prevent it from reproducing
certain colourful settings well, even if you viewed the photo on a wide gamut
screen.

------
pasta
There is a very interesting subgroup in 3D rendering that uses wavelengths for
calculations instead of the RGB-model.

This is called spectral rendering (other names are used).

Some even use wavelenths outside the visible range and calculate the
interaction between different wavelengths.

Most of those renderers are experimental but it's worth looking at them if you
like this subject.

------
iooi
This article touches on it a bit, but I would love a piece like Modern CSS
Explained For Dinosaurs [1] for color spaces. The history of RBG, XYZ, CMYK,
sRGB, etc. would be pretty interesting on their own.

[1] [https://medium.com/actualize-network/modern-css-explained-
fo...](https://medium.com/actualize-network/modern-css-explained-for-
dinosaurs-5226febe3525)

------
zokier
One interesting facet of all this is that afaik most of our hyper-realistic
"physically based rendering" 3D renderers are still based on these color
models instead of modeling the light spectrally. I imagine that somewhere in
near future that will change as we start reaching the limits of the color
models.

It is actually interesting how well simple RGB has served in practice when it
is fairly simple to imagine scenes where it really shouldn't (and wouldn't)
work at all.

~~~
yuchi
See
[https://news.ycombinator.com/item?id=16799578](https://news.ycombinator.com/item?id=16799578)

~~~
zokier
I did some googling around and seems like spectral rendering is escaping the
research labs; Weta is reported to be using spectral rendering and Wikipedia
lists several renderers in the "Spectral rendering" page:

> For example, Arion,[1] FluidRay[2] Indigo Renderer,[3] LuxRender,[4] mental
> ray,[5] Mitsuba,[6] Octane Render,[7] Spectral Studio,[8] Thea Render[9] and
> Ocean[10] describe themselves as spectral renderers.

[https://en.wikipedia.org/wiki/Spectral_rendering](https://en.wikipedia.org/wiki/Spectral_rendering)

Of those, LuxRender is of special interest considering that it is FOSS and as
such freely available.

------
keerthiko
I have been working on a video game with a puzzle mechanic involving mixing
paint to create trails in a racetrack, and I have learned a lot about the
intuition gaps in light/color physics theory while testing with people. I was
going to make a post about it but this is an even more in-depth exploration of
the whole thing from the bottom up.

I will be referencing this on our game site when it's up!

~~~
krastanov
Could you elaborate on the intuition gaps that people have? I have a pretty
good understanding of color theory and the physics/biology behind it, but I
have no knowledge on the pedagogy of it. Hence learning about the more common
false beliefs sounds fascinating.

~~~
keerthiko
Mainly, the concept of subtractive mixing.

Paint (or pigment) works by absorbing a portion of the visible spectrum and
reflecting the rest. What you see is what is reflected. When you mix pigments,
both portions of the spectrum are absorbed, and a smaller resultant portion is
reflected.

We mostly think of color in terms of light, and mixing colors of light which
is often the opposite (light: "all colors mixed is white" as opposed to paint:
"all paints mixed is black"). Our game uses paint as the underlying physics
concept rather than light.

Adding cyan to magenta gives blue when you're talking about pigments. Even in
the case a player understood the theory of light and pigments, when playing a
game you need to reflexively tap your intuition to understand what happens
when a change is affected: "When I add/remove X color to Y what do I get?"
Additionally, players weren't used to CMY as the primaries and always thought
in terms of RGB.

Because our game is a real-time (racing-based) puzzle game, we had to do many
iterations on our game UI to help players answer this question much faster
while also navigating the level.

From our game design standpoint, this was the major intuition gap we
encountered.

~~~
invincing
I think the intuition gap comes from the misleading arts education about
colour. It's still common to teach in schools that primary colors for paint
are blue, red and yellow - when the correct primary colors are cyan, magenta
and yellow as everybody familiar with CMYK printing can tell. If you search
the internet about mixing paints, almost every site claims that the primary
colours are blue, red and yellow... So I don't think it's the subtractive
mixing itself, but subtractive mixing with CMY colors (and not the wrong model
of red, blue and yellow they are used to).

There's long history of arts education with this misconception, partly because
suitable pigments for CMY colour model are relatively new invention. Blue, red
and yellow also kind of work well enough, especially if you tweak the palette
by having two shades of each as your "primary colors". (E.g. you can mix
saturated green from cadmium yellow and prussian blue, but if you mix chrome
yellow and ultramarine blue, the green will be muddy). It's kind of like
instead of having a full triangular gamut of CMY space, you crop the corners
off of the triangle and have a a sort of hexagonal gamut.

As primary colors are by definition "colors that can't be mixed from other
colors", it's strange that in arts education they still claim that red and
blue are primary colors, when it's obvious that red can be mixed from magenta
and yellow, and blue can be mixed from cyan and magenta, as every colour
printer is doing it like this.

------
ThoAppelsin
The part where he takes the human sensitivity into account has grabbed my
attention. It looks a little suspicious to me the way he simply just
multiplies the normalized relative sensitivity measure with the spectral
fluxes.

The way it is calculated now, the only way for a spectral flux (SLF) to be
optimal considering its spectral luminous flux (LF) is to be entirely
concentrated at ~550nm, laser-like. However, such a light would leave many of
the cones in our eyes unsatisfied, hinting that this shouldn't really be the
optimal.

I am by no means an expert, but I would expect a LF to be optimal when it
matches the relative human sensitivity in shape, instead of the one focused as
an impulse at the peak of the relative human sensitivity.

~~~
dahart
> It looks a little suspicious to me the way he simply just multiplies the
> normalized relative sensitivity measure with the spectral fluxes.

What is suspicious about it? This is how all response functions work
mathematically, both for humans and animals, as well as for mechanical
sensors.

The response function is the measured ratio of the input value to the output
response (for a given wavelength in this case, but it could be for any
measurement at all.) Because it's a ratio, simulating the response is a
multiplication, no other operation will be correct.

> I would expect a LF to be optimal when it matches the relative human
> sensitivity in shape

Arriving at that idea does make some intuitive sense, but it would not be
optimal. For the best possible response, you'd put all your energy into the
maximum of the response function and nowhere else.

Imagine you could bet on a coin toss where the coin is known to land on heads
2/3rds of the time and tails 1/3 of the time. You can guess the tosses in
advance, and for every correct guess you win $1. Should you bet on heads
2/3rds of the time and tails 1/3rd of the time, because that matches the roll
probability? Or should you bet on heads all the time? It's simple to show that
always betting on heads will net more money, statistically speaking.

~~~
ThoAppelsin
An analogy of filling a curved-bottom tub would be a better fit than of
someone making bets optimally when the chances are non-uniform. Our cones can
be stimulated only up to some certain amount. At the point of saturation, any
further stimuli would have no effect, other than perhaps frying the receptors.

I would also suspect that the receptors are becoming less and less sensitive
to the stimuli they accept as they get closer to saturation, making the
relation non-linear, and shaped more like a saturation curve.

If that really is the case, then a LF really would be better off if it was
more bell-shaped and wide as the relative human sensitivity, than being an
impulsive one at the peak. It would be like that because as the LF starts
doubling down on the highest bid (~550nm), the _marginal response_ other
wavelengths would start becoming more viable, eventually taking 550nm off the
first place.

There also is the possibility that the author has done his research well
before spending so much effort on preparing the article. Even then, this could
be the reality that we are yet to discover.

~~~
rcthompson
You're right that once you saturate your green cones, the marginal response of
other wavelengths will overtake 550nm. But until you hit saturation, the most
efficient use of energy is to put everything on 550nm, not spread it out.
You're saying that changing the response curve (e.g. by saturating the green
cones) changes the optimal wavelength, but that doesn't change the fact that
there's always a single optimal wavelength that is the argmax of the current
marginal response curve.

In any case, we're talking about displaying color on computer monitors here.
If your computer monitor is getting anywhere near saturating your cones, you
have a big problem.

------
coldacid
I've been looking for this kind of breakdown for years. So glad to finally get
some understanding of how colour codes end up becoming the colours we actually
see!

------
dtn
On a similar vein, I've used
[http://www.huevaluechroma.com/](http://www.huevaluechroma.com/) extensively
for learning about color theory. It's incredibly comprehensive and tailored
for practical application (painting, more specifically).

~~~
jacobolus
That one is a much better source to start with, IMO.

------
mcCuppaT
Very interesting article. I've known for a long while our eyes were most
receptive to green light, up until now I never it was our peak sensitivity to
light is at 555nm aka green

------
ww520
Very in depth informative description about color.

------
gilbetron
Very relevant xkcd: [https://xkcd.com/1882/](https://xkcd.com/1882/)

~~~
dahart
Randall's done a lot more with color...
[https://blog.xkcd.com/2010/05/03/color-survey-
results/](https://blog.xkcd.com/2010/05/03/color-survey-results/)

------
pi-squared
Wow.

