Initial publication: August 2012. Updated for latest browser versions November 2013.
Anyone who is interested in sharing photography on the web sooner or later encounters the problem of browser color management. Not too long ago, color management on the web was simply non-existent. Things have improved, but along with progress come partially implemented features and exceptions.
On this page, I hope to shed some light on the current state of color management for the three major browsers on the Windows platform: Internet Explorer, Firefox and Chrome. Whenever those features depend on user preferences, I will clarify their scope and effect.
Conceptually, color management in a web browser context consists of two stages: interpretation and output mapping. The interpretation stage is concerned with taking the color information on a web page (typically in the form of RGB triplets) and interpreting them in terms of a color space. This associates an intended visual response with the RGB numbers. Then, in the second stage, these colors are converted back to (different) RGB triplets are sent to the monitor.
In browsers that lack color management, the RGB input values are sent straight to the monitor, without any attempt to match intended and observed colors. Predictably, this can lead to large color discrepancies due to differences in equipment and viewing conditions between creators and observers of images. In the following, I will outline the desired behavior of web browsers in each of the two stages.
Typically, a page consists of a number of elements, which may require different treatment. Four important categories are listed below.
Application of monitor profile. A monitor profile describes the relation between the RGB values sent to the monitor and the colors that are perceived by the viewer. The browser should use the monitor profile to convert the intended colors to RGB values that will produce the desired sensory response in the observer.
In dual monitor environments, the browser should also detect on which monitor it is being displayed, and use the appropriate monitor profile. This is common for color-aware applications such as Photoshop, but none of the current browsers do this (see table below). Make sure you run the browser on your primary monitor.
Internet Explorer should not be used for color critical work. Although it understands both ICCv2 and ICCv4 profiles, it does not use the monitor profile, which means you cannot rely on what you're seeing. IE11 may be passable only if you have reason to believe that the native response of your monitor is close to sRGB. Otherwise, avoid.
Firefox is currently the best choice for color managed browsing. It provides good out-of-the-box support for ICCv2 images and the monitor profile. Support for ICCv2 LUT and ICCv4 profiles and the default assignment of sRGB profiles can be enabled through user preferences (see instructions below).
Chrome's color management solution may be sufficient in particular scenarios. However, the future evolution and support of color management features in Chrome is uncertain.
Chrome provides out-of-the-box support for basic ICCv2 profiles and the monitor profile.
When additionally using the '--enable-monitor-profile --disable-gpu' command line switches (on Windows), all page content - including untagged images, HTML/CSS elements and Flash content - is treated as sRGB unless otherwise specified. Because most color-managed content is sRGB (explicitly or implicitly) this works well enough for most pages. Unfortunately, using this switch restricts the gamut of all images is restricted that of sRGB. This effectively forces users with wide-gamut monitors to choose between wide-gamut rendering and color management of untagged objects.
|Stage 1: interpretation||Stage 2: output mapping|
Supports ICCv2 matrix profiles
Supports ICCv2 LUT and ICCv4 profiles
|Treats untagged images as sRGB||Treats HTML/CSS colors as sRGB||Uses monitor profile||Uses profile for secondary monitor||Monitor black point compensation|
|Internet Explorer 11||yes||yes||n/a||n/a||no||n/a||n/a|
|Chrome 31||yes(4)||no||Windows-only option(3)||yes||no||no|
The color management settings are accessed by typing 'about:config' (without quotes) in the address bar and acknowledging the warning message. You can navigate to a relevant key by scrolling or by typing part of its name.
Chrome offers only one color management option in the form of a command line switch. When enabled, all content is assumed to be in the sRGB space and converted to the monitor's color space using the monitor profile.
To enable this setting, the '--enable-monitor-profile --disable-gpu' command line option must be invoked whenever Chrome is launched. As a browser can be launched in multiple ways, you may need to make the necessary changes in multiple places. For example, Chrome may be launched from the taskbar, the start menu, the mail client (web links) and by opening clicking supported file types. Each of these requires specifying the command line option in the relevant place.
Here, I will describe only the process for supplying the command line option via the taskbar and start menu. Locate the Chrome icon, right-click on it and select 'properties'. If you're doing this on the taskbar, you will have to right-click again on the Chrome icon in the pop-out menu before you can click 'properties'. On the 'Target' line, after [...[...]chrome.exe, insert a space and enter '--enable-monitor-profile --disable-gpu' (without brackets). Click OK, close and relaunch Chrome.
All tests were performed on Windows 8.1, with an ICCv4.2 monitor profile generated by the Eizo ColorNavigator 5.4 software. To determine the capabilities of each browser, I have used the tests on the following pages:
In my case, my main monitor has a response that is quite similar to sRGB, which can make it hard to say with certainty whether the monitor profile is being applied. To account for this, I used an alternate calibration for my monitor with gamma=1 (linear profile). When this calibration is loaded, failure to use the profile results in images that are too bright.