Adobe’s Kuler color app is a great tool for designers but is your display accurate enough for it?

Screenshot of Adobe's Kuler app showing color extraction from a photo

Screenshot of Adobe’s Kuler app showing color extraction from a photo

Adobe recently released a new iPhone app called Kuler that let’s you extract colors from your surroundings using the phone’s camera. It’s a useful tool that allows designers to capture color inspiration wherever they find it and easily incorporate it into their work via color palettes.

The app also highlights a weakness in current display technology: no display on the market today can actually reproduce all the colors we see in the environment around us. So, even if the camera sensor can capture that color you love, you may not be seeing an accurate representation of it on your device.

The iPhone 5’s LCD display is designed to cover the sRGB/rec.709 color gamut standard used for HDTV broadcasts. And, it looks great but compared to the world we see around us, it’s just not quite as rich. If we plot the iPhone 5’s color gamut against the gamut of colors found in nature, the phone comes up short in important reds, greens and cyans:

Color gamut of the iPhone 5's display compared to the gamut of colors found in nature. The iPhone 5 comes up short in red, green and cyan.

Color gamut of the iPhone 5’s display compared to the gamut of colors found in nature. The iPhone 5 comes up short in red, green and cyan.

If DisplayWeek 2013 was any indication, color has once again become a hot topic in the display industry. Color gamuts are getting larger and it may not be long before we see a display that can match what our eye sees in nature. Over the course of the next year, we will start to see more wide color gamut-capable devices as OLED continues to expand marketshare and new technologies like quantum dot LCD begin to enter the market in volume.

Color of the year for 2013 falls outside sRGB gamut

Pantone Emerald 17-5641

Pantone recently announced their color of the year for 2013, a deep shade of emerald green that they call “Emerald 17-5641.” It’s a great color but there’s a catch- most displays cannot accurately show it.

Based on data from Pantone’s website, I was able to plot the color in CIE 1931 (xy). As you can see in the chart below, Pantone’s color is well outside the sRGB/rec.709 color gamut standard used by most HDTVs, the new iPad/iPhone and many desktop monitors. These devices will be stuck showing a version of Pantone’s emerald green that’s less saturated and probably a bit more yellow than the real thing.

Pantone Emerald 17-5641 vs sRGB, Adobe RGB 1998 and DCI-P3 color gamuts in CIE 1931

This is a perfect example of a popular real-world color that falls outside of the sRGB/rec.709 gamut. Unless you have a monitor that’s able to show wider color gamuts, like the DCI-P3 or Adobe RGB standards, you are missing out on a great color.

Updated: How does the iPhone 5’s color saturation measure up against Apple’s claims?

Commenter William thankfully double checked our math and we’ve corrected a small error in our % NTSC calculation.

We finally got our hands on an iPhone 5 yesterday. I tried asking Siri if she really has 44% more color saturation but she wouldn’t give up the goods, so I went with plan B and aimed our PR-655 spectroradiometer at the phone to find out just how impressive the screen really is. A lot has already been written about this display, but not much empirical evidence has been published about the color performance. How does the screen actually stack up to the marketing claims?

In short, Apple did an exceptional job improving color saturation and display quality in general, but the unit we measured just missed the 44% more color saturation claim.

Measuring Up

The iPhone 5 has significantly more color saturation than the 4S.

The 44% more color claim for the iPhone 5 is the same claim Apple made for the new iPad. As with the iPad, increasing the color performance of the iPhone 4S by 44% of NTSC 1953 gamut, measured using the CIE 1931 color space, would result in color saturation matching the sRGB color standard.  Using these standards as the goal posts, we measured the iPhone 5 at 70% of NTSC 1953 in CIE 1931, a 39% increase from the iPhone 4S, which measured at 50%. That’s 5% less of an improvement than Apple’s 44% claim and just 99% of sRGB (measured against the sRGB primaries).

While 5% less might seem like a big deal, getting to 99% of sRGB is a major feat and will result in tremendously noticeable color improvement in the phone. Additionally, color filters are notoriously difficult to manufacture. Slight variances in performance like this are common and most likely outside the range of a just noticeable difference for the average person.

If you want to know more about NTSC, CIE and sRGB, and why we are using standards from the 1930s, I have written extensively about this issue in the past.

How did they do it?

Much like they did with the new iPad, Apple significantly improved the color filter performance of the iPhone 5. Based on our experience, this type of improvement typically means that the display requires 20-30% more power to operate at the same brightness. Considering that the display is already a major source battery drain on the phone, this further underscores the engineering effort Apple made to keep battery life about the same as the 4S.

Let’s take a quick look at the changes in each of the red, green and blue color filters, starting with white, which is all three filters turned on:

Looking at the white spectrum of the iPhone 5, we see that the new color filters are very similar to those of the new iPad. Compared to the 4S, the peaks are slightly narrower, which improves color purity. In order to meet sRGB, they also moved to deeper reds and blues.

As with the new iPad, the biggest difference between the 4S and the 5 is in blue. Apple moved the peak to a deeper blue but, more importantly, they narrowed the filter so less green light leaks through. The green leakage causes blue to look a bit “aqua” on the 4S.

Retinal neuroscientist Bryan Jones looked at both displays under his stereo microscope earlier this week. His close-up shots really show off the difference in blue filters.

Apple again chose a slightly deeper wavelength of green which is less yellow and eliminated some of the blue leakage that had been muddying the green on the 4S.

The change here is subtle but as with the other filters, the peak is narrower, deeper in the red and leakage is reduced. One difference worth noting is that, while we are seeing less peak leakage in the red filter, there had been relatively broadband leakage across yellow, green and into blue that has been largely eliminated.

Conclusion

In all, it’s an exceptionally well-calibrated and accurate display for any kind of device, especially a smartphone. Apple has gone to great lengths to design a screen that brings the vibrancy of sRGB to the palm of your hand.
If you are not familiar with color filters or the inner-workings of LCDs in general this great live teardown by Bill Hammack is well worth watching: http://youtu.be/jiejNAUwcQ8

iPhone 5 color saturation claims

Display improvements were once again featured at yesterday’s Apple keynote event. The most obvious improvements may have been the larger display and thinner form factor but most interesting to dot-color are the color claims.

Just like the new iPad, Apple claims that the iPhone 5 can display “44% more color saturation.”

Apple SVP of Worldwide Marketing Phil Schiller talks color saturation at the iPhone 5 keynote

Let’s do some simple math to see how the iPhone 5 stacks up against older iPhones and last week’s color performance claim from Motorola.

  • iPhone 4S IPS LCD: 50% NTSC color gamut (CIE 1931)
  • iPhone 5 IPS LCD: 50% * 144% = 72% NTSC color gamut (CIE 1931)
  • Motorola Droid Razr Maxx HD AMOLED: iPhone 4S (50%) * 185% = 92.5% NTSC (CIE 1931)

So Motorola is still king of the fall 2012 smartphone color saturation, based solely on marketing claims. That said, I wouldn’t be surprised if they updated their marketing to say that the Droid Razr Maxx HD offers 28% more color saturation than the iPhone 5 once it hits store shelves in a couple weeks. I plan to measure all of the announced devices to verify these marketing claims, but for now, this is all we have to go with.

Apple also claimed to be able to match the sRGB standard used in TV and movies. With the addition of the iPhone 5, nearly all of Apple’s flagship products (with the exception of the MacBook Air) now meet this standard. This means content should look very consistent across all Apple devices and may open up the possibility for serious content creation apps in iOS.

It also means we’re only just now catching up to an average CRT display from circa 1990, as the sRGB standard is based on the capabilities of phosphor materials used in CRTs. And even still, the new displays are only covering about 35% of the range of colors a human eye can see. There’s still plenty of room for improvement in display color performance (as well as updated content delivery standards, but that is a whole different post).  Hopefully if we keep on this kind of pace with display enhancements, next year we’ll start to see a push beyond the limits of last century’s color standards.

We’re using the long outdated CIE 1931 color space and NTSC 1953 gamut standards here since this is clearly Apple’s reference when they claim 44% more saturation and sRGB coverage. 50% * 1.44 = 72% and 72% of NTSC 1953 gamut in the CIE 1931 color space is also called the sRGB color gamut.

It is not clear which color space Motorola is referencing; we are assuming CIE 1931/NTSC 1953 for ease of comparison.