Color Profiles, Digital Photography, Photoshop, and YOU

...or "Everything I Know About Color Profiles"...

Note: this is something of a rough draft... I would appreciate feedback and will try to incorporate it as much as possible.

It is really, really important to understand and be comfortable with ICC color profiles if you're serious about digital photography. So this is everything I know about the subject, in one place, mostly so that I can send people this link if they are having questions or issues.

Questions this might answer:

Why do my images look great on my screen at home, but too [whatever] on someone else's?

Why do my images look great on a PC, but washed out on a Mac?

Why do my images look great in Safari, but washed out in Firefox?

Why do my prints look terrible when the images look great on screen?

Do I want to enable color management in Photoshop?

If you know a bit about color management and just want the short answer, here it is: shoot in Adobe RGB, use a color-managed workflow (such as Aperture or Lightroom, or Photoshop with color management enabled), calibrate your monitor, export for the web in sRGB with an embedded profile.

Some people will disagree with some of the above, some people will have different software, etc. OK.

Digital Color and Color Spaces

Pixels in images shot on digital cameras have three numeric values, a red value, a green value, and a blue value, aka RGB. An 8-bit image (JPEG is an 8-bit format, for example) can have everything from (0,0,0) to (255,255,255) ("pure" black to "pure" white, respectively). My baby's eyes have many different shades of blue in them, but one of them is (103,115,136).

Every digital image ever recorded was recorded in a particular color space, whether intentionally or by default. A color space defines a gamut, which could be described as the field on which a pixel in that space can play. A "larger" gamut is a larger field, there are more possible colors than in a "smaller" gamut. A pixel, i.e. one set of (R,G,B) color values, only has meaning in a color space. The color space defines what that pixel really means in the universe of all colors.

Where matters get complicated is in dealing with rendering an image onto a device, such as a monitor or piece of paper. Physical devices have varying capabilities and gamuts, and thus it is necessary to convert, or translate, a pixel's value from whatever space it is in to the space it is being rendered on.

Color Profiles

An ICC color profile is a description of a particular color space suitable for computers to convert between it and another color space (profile). As I said earlier, every image exists in a color space, that is, it has a color profile. The question then is whether we know what that profile is.

Here's where this becomes practical, and really not very complicated (yet). Most image formats support embedding the ICC profile in the image file itself, and thus any application wishing to render the image has the opportunity to properly interpret its pixel values. So the first thing to take away from this is: embed the ICC profile in every image you save! (providing that the format supports the concept... JPEG, PSD, TIFF, etc. all support this)

Which Color Space?

So by now you're probably asking this question... which color space should I use? The answer is it depends. But here are some guidelines:

sRGB was designed to approximate the gamut (and gamma) of a standard PC monitor

sRGB has quite a small gamut as a result

Many digital cameras shoot in sRGB only

Digital SLRs and maybe some others may allow you to shoot in AdobeRGB, which is a much larger gamut than sRGB

Because it was designed to look approximately correct without converting color spaces, sRGB is the profile of choice for web use

Shooting in AdobeRGB will preserve more information than shooting in sRGB

As such, it would be "better" to shoot in AdobeRGB if you can, as long as that doesn't put a big road block in your workflow (because you will now need to convert your web output to sRGB)

Color managed workflow software, such as Aperture and Lightroom, make all of this much easier

The Problem

So what's the big deal, why do color space issues and questions come up over and over and over?

The problem is applications. Virtually all applications on the Windows platform are totally unaware of color profiles. This means that even on a calibrated PC display, images may or may not render correctly. sRGB images should look pretty close on most. This is the big reason to save your web output in the sRGB space, it's really the only hope of getting an image to look close to correct for Windows users.

Most Mac applications do obey color profiles because that handling is embedded into the OS, but there are some notable exceptions.

Web Browsers (The Problem Continued)

Only one web browser obeys color profiles: Safari (by Apple). Every other browser will ignore them completely. This is extremely unfortunate, and it is the cause of much frustration, oddly enough to Mac users.

UPDATE: It appears that Firefox 3 (currently in beta) supports color profiles, but you have to enable it. It would be nice if it was on by default, sigh... but support is a far cry from no support, so thank-yous to Mozilla (and to the commenter who pointed it out). [updated 04.04.08]

The problem is this: the default gamma on the Mac is 1.8, whereas it is 2.2 on the PC (I like 1.8, FWIW). This means that an uncorrected image that looks correct on a PC display will look washed out on a Mac display (if gammas are left at their defaults). But Safari obeys profiles, so if you embed the ICC profile, it will render every one of your images correctly, even though the gamma is different (because it is converting between the embedded profile and the profile of your display).

However, Firefox does not obey color profiles, and thus Mac Firefox users will see just about everything on the web a little washed out.

Conclusions

What can we learn from all this?

Use color management. Turn it on in Photoshop, use color-managed workflow tools, etc.

Calibrate your display so that at least you are seeing accurate color.

Embed color profiles. This gives you the best chance of someone else seeing the image as you intended.

Don't use Firefox on the Mac for looking at photos (e.g. on Flickr).

FAQ

Back to those questions...

Why do my images look great on my screen at home, but too [whatever] on someone else's?

Probably because one or both of you have uncalibrated displays, or possibly because you didn't embed a color profile. Or both.

Why do my images look great on a PC, but washed out on a Mac?

Probably because you didn't embed a color profile, or because you're using Firefox on the Mac.

Why do my images look great in Safari, but washed out in Firefox?

Because Firefox does not support embedded color profiles, and renders everything without correction for the typical Mac display.

Why do my prints look terrible when the images look great on screen?

There could be a lot of things going on, but the first place to look is at color profiles. Is your display calibrated? Do you have an ICC profile for your printer? Is it being used? Is something else also doing color translation when it shouldn't?

Typically I get a profile for my printer, paper, etc. and turn off the native OS's attempts at color translation, allowing the app (Photoshop, Aperture, etc.) to do the color converting.

Do I want to enable color management in Photoshop?

YES.

Technorati Tags:
color, color profiles, photography, photoshop