Hacker News new | comments | ask | show | jobs | submit login
Color: From Hex codes to Eyeballs (jamie-wong.com)
563 points by markdog12 10 months ago | hide | past | web | favorite | 54 comments



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.


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 [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.


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.


Which book(s) would you recommend?


These sorts of mental models are pure, pure gold. I spent a lot of time looking at various descriptions of color spaces and while I could do all the calculations, I never had a clear understanding of _what_ I was doing and _why_ it worked.

So in 4 paragraphs you've managed to leapfrog my understanding far more than weeks of formal training.


> 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.

You can exploit cone fatigue to experience a greener green: make the red and blue people play tug of war by themselves with high intensity, then if you immediately call in green's fresh strength, red and blue will be easily overpowered.

(Slight model inaccuracy: the cells themselves aren't the colors, they're just cells with low-, medium-, and high- frequency sensitivity. Interestingly, the color experience you get from activating just one type of cell is different from the one you get from monochromatic light at their respective spectral peaks. I find deep (long-wavelength) red, for example, to be rather different.)


As a "colorblind" person, this is a bit frustrating so bear with me.

Few people are literally "colorblind". You don't have one cone cell of each type, you have loads of them. Colorblind people generally have fewer of them (or some of them are shifted) but usually only for one type (usually red/green).

The "red" and "green" cones overlap quite a lot[1] and they also overlap with the rods. This means that even if you lack some "green" cones you will still likely perceive "green" colors, except they will be hue-shifted into red and less saturated. Simulating this effect for people with normal vision usually results in "muddier" colors.

Your analogy is pretty good otherwise (except as someone else pointed out, that's apparently not at all how the signals are processed) but this seems to be a widespread misconception about color "blindness", so I felt it's important to point that out.

It's also worth mentioning that it's meaningless to say "there's no such thing as pure green". Physically isolating certain wavelengths produces a "pure green" light. What someone with normal color vision perceives when they see "pure green" light is the result of multiple cones being stimulated at the same time, sure, but there's no one-to-one mapping of cones and colors except for some very small bits at both ends of the spectrum, which is why the cones are generally referred to as L/M/S (for long/medium/short wavelengths) rather than R/G/B (for the colors).

A tetrachromatic person (assuming the fourth cone type's peak sits somewhere between 420nm and 564nm, i.e. "blue" and "red") likely won't enable someone to perceive colors outside that range. In your example, the 3 people are forming a lopsided triangle. Adding a fourth person makes it a four-sided polygon but doesn't add another dimension. Tetrachromacy (depending on where the cones lie) would make it easier to distinguish certain shades though by making them more vibrant -- to them, normal vision would appear as "muddy" as my vision does to someone with normal vision.

[1]: https://commons.wikimedia.org/wiki/File:Cone-response-en.svg

EDIT: Because some people find that interesting, here's a page with a bunch of photos that fairly accurately simulate my color vision (i.e. looking randomly at both sets of photos I wouldn't be able to tell you which one is the original): https://web.archive.org/web/20160308043950/http://critiquewa... -- apparently brown skin looks green to me.


The genes for L and M cones are on the X chromosome and there are some variants for each type, or sometimes one is missing. This mostly affects men, since they have only one X chromosome, so if the gene for e.g. the L cones is missing then they end up as dichromate or if they get two variants which overlap too much there isn't much differential signal. A small number of women end up as tetrachromats because they have e.g. 2 types of L cones with slightly different spectral sensitivity, one from each of their X chromosomes. It's still not clear as far as I know whether such women see a dramatically wider range of colors, or whether it's more of a slight advantage in discriminating some near-looking colors which appear identical to other viewers. Human tetrachromacy is rare and hasn't been studied too deeply from what I've seen.


FWIW from the few studies about human tetrachromacy that I've heard of it seems that the women do in fact just see some similar-looking colors as more obviously distinct.

AIUI In order to see any "new" colors (i.e. outside the "visible" spectrum) they'd need to be more sensitive to UV or IR light (which in addition to being able to perceive those in isolation would presumably also mean being able to perceive those in combination, which indeed would drastically extend the numbers of colors).


> Physically isolating certain wavelengths produces a "pure green" light.

What, can we get an wavelength-energy distribution that looks like a Dirac delta?

There are discontinuities in physics but you kinda need to be careful to see if what you think is a discontinuity is one.



What this is saying is that a perfect sinusoid has a single frequency?

Of course. Sorry, I'm stupid. Born like that.


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

2. https://i.imgur.com/M6Oo6dp.jpg

I think I'll probably open source it soon.


There is also a very nice JS lib that does this: https://jariz.github.io/vibrant.js/


Very interesting! I think you have a powerful base for building posters on the fly. Take image A, crop the background, take the colors from your algorithm and use the ones that the regular algorithm wouldn't consider (the ones that stand out more but appear in less quantity) for generating headers and subheaders of the poster. You have a color balanced algorithm made poster with just an image and a background as an input from the user.


Could you please give me a link to your github account?(assuming that's where you'll put the source)

I've been wanting to do this for a while but figured out that I lack the knowledge and time to do it properly


Replying to keep track and or follow your github when/if you post this.


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!


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

http://www.handprint.com/LS/CVS/color.html


See also the classic Color FAQ:

http://poynton.ca/ColorFAQ.html


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


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/


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.


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.


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.


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?


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?


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.


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.


From the article: "All of the diagrams in this blog post are in sRGB color space. That means that all colors outside of the sRGB gamut aren’t accurately reproduced in the diagrams in this post!"


Your computer monitor works within the sRGB (or comparable) color space, so it physically cannot render colors outside of that color space. When you look at that diagram you're seeing a representation, not the real deal.

Pigments could theoretically do a better job than pixels. But those would have to be some very good pigment$. I'm not sure if there is a printer that can produce this in practice. Your cheap inkjet printer definitely won't. The most expensive printers haven't been designed to cover the full human visual spectrum either, out of technical limitations, or cost limitations. And even when you have the pigments on print, the light $ource would have to contain the entire visible spectrum at high intensity (basically you'd need a very bright white light, as bright as the sun). And then the surface cannot have any glare. etc. So not very practical to achieve.


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.


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...


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.



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

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


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!


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.


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.


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.


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.


> 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.


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.


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.


> An analogy of filling a curved-bottom tub would be a better fit

No, it would not. That rationalizes your concept of trying to match the input distribution with the response function, but it is specious and incorrect to apply it to a response function. Filling a tub with liquid allows liquid in one place to move to another place. Light doesn't work that way, light at 550nm doesn't spill over to 600nm. The incoming light at 550nm is completely accounted for in the output response, and doesn't affect the response at 500nm or 600nm, and isn't affected by input at 500nm or 600nm.

The response function is literally an efficiency curve. If you want maximum efficiency or maximum output, you give it inputs that land at the apex of the efficiency curve.

> I would also suspect that the receptors are becoming less and less sensitive to the stimuli they accept as they get closer to saturation

That is correct, but outside the bounds of what this article is discussing. For all practical normal daylight situations, which the range of all monitors lands inside, response is roughly logarithmic (or linear on a log scale). Clamping or saturation in the response happens in extreme darkness and extreme brightness. Response to the night sky in between stars, or to staring directly at the sun have a non-log. Response to computer monitors and almost everything you see during the day is linear on a log scale.

> If that really is the case, then a LF really would be better off if it was more bell-shaped

It's extremely unlikely that there's any real-world scenario under which this is true. But if you want to do this thought experiment, then you need to account for the receptors saturating. If you push the receptors to saturation, then their entire response goes flat, changing the overall shape of the response function. By matching the shape of the response function and then saturating, you force your target to move, and then get the wrong answer anyway.

If you push one receptor to saturation, the next best answer would be to put the remaining portion of your power distribution at the apex of response sensitivity for the other two receptors, so you'd have three specific wavelengths, but not a bell shape.

Here's an deeper discussion of human visual response that includes cases of extreme ranges and saturation: http://www.telescope-optics.net/eye_intensity_response.htm

Look specifically at figure 242. Monitor level brightness response is very near the center-line (vertically) in the chart. All normal daylight conditions are represented between the "cone threshold" (0.001mL) and "discomfort" (100,000mL) marks vertically. You will note that no response clamping occurs between these values.


> 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.

Yes, that's correct. For maximum brightness given a limited amount of energy, you want all the light to be emitted at a wavelength matching the maximum of the eye's luminosity function. Of course, if the light is very bright, it will saturate your green cones, at which point you would want to stop adding 550nm light and switch to a wavelength that matches one of your other cones.


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!


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


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


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


Very in depth informative description about color.


Very relevant xkcd: https://xkcd.com/1882/


Randall's done a lot more with color... https://blog.xkcd.com/2010/05/03/color-survey-results/


Wow.




Applications are open for YC Summer 2019

Guidelines | FAQ | Support | API | Security | Lists | Bookmarklet | Legal | Apply to YC | Contact

Search: