FIREFOX-MOZILLA Color Management Config & Test

HERE IS A DEFINITIVE TEST rollover to determine if your Web browser is defaulting Untagged color to sRGB (and if it is Converting Untagged color to your monitor profile) — and/or if Firefox 5 is using Full Color Management option Value 1:

Move mouse curser on-off image to rollover examples.
PDI photos courtesy of Getty Images, PhotoDisc®.

If the Tagged Whacked RGB image is a visual dead-on exact "MATCH" with the Untagged sRGB IEC61966-2.1 rollover your Web browser is in full compliance with Firefox's "Full Color Management" standard: about:config gfx.color_management.mode Value 1.

In other words:

Your Web browser is Assuming-Assigning-Applying the sRGB profile to Untagged color by default — and then your browser is Converting or correcting or remapping it to your monitor profile.

If you observe even the slightest color change or brightness shift in the above rollovers, your browser is not Fully Color Managed (by the criteria of this best Firefox test page).

If the top image above looks horrid blue, your browser is not color managed. If its rollover mate looks horrid red, you are probably on a wide gamut monitor. More on troubleshooting and fixing these bizarre color issues below....

WINDOWS-SAFARI DISCLAIMER: I had a few minutes access to a Windows Vista machine (using the default NEC 2490WUXi stock monitor profile) and noticed that Apple's Safari 5 Web browser was "matching" the above rollovers — this was a surprise that Safari on Windows was able pull this magic feat off. Because the monitor was not calibrated, I wasn't able to discern if Safari was Converting the Tagged image to sRGB or to the monitor profile, so I profiled the monitor with X-Rite Gretagmacbeth iMatch1, eye-one display2 package to observe what profiles were being used. My guess is that FF read the embedded profile and Converted it to sRGB (Vista's default profile), and Firefox Applied its default profile (sRGB) to the untagged sRGB rollover, and then sent both images to the monitor as sRGB with no Conversion to Monitor RGB. Re-testing Windows Vista Safari with the custom monitor profile enabled gave me the results I expected (a slight mismatch): Safari was Converting the Tagged image to Monitor RGB, and Safari was Assuming sRGB with no Conversion to Monitor RGB...or so it appeared to me.

"It is the theory that decides what we can observe." - Albert Einstein

VERSION 4 ICC PROFILE COMPATIBILITY: Firefox will not be able to display this tutorial properly if your monitor profile is ICC v4. Using a defective or inaccurate monitor profile will also skew my color examples.

What is the best profile for the Web: sRGB?

Notice the above Untagged sRGB rollover more than likely displays reasonably okay in all your test browsers.

This is because the Internet is arguably based on the sRGB Color standard. This means any browser you test should display sRGB reasonably okay — with two exceptions:

1) Your display monitor is 'calibrated' to Mac 1.8 gamma in which case 99% of the Internet looks light and washed out (whether you realize it or not), and

2) You are using a so-called wide-gamut monitor and sRGB looks very over saturated especially in the reds.

NOTE:

Firefox 5 4 and 3.6 fix all of those issues on Mac operating systems because Firefox OVERRIDES ColorSync® and OS-X® system Defaults and assumes its own Default profile: sRGB (arguably the target Color Space of the Web).

The Mac OS defaults to its Monitor RGB by system default.

Windows OS defaults to sRGB by system default.

Photoshop defaults to its Working RGB by application default.

Not sure what GNU/Linux defaults to.

If the above top "Tagged Whacked RGB" image looks correct (not blue) — your Web browser is color managed, specifically:

1) Your browser is (at least) reading the ICC Source Profile embedded in the "Tagged" test image, and

2) Your browser's Color Management System (CMS) is Converting (re-mapping, correcting) the Source Profile (color) to your Monitor Profile (for a theoretical display of True Color).

NOTE:

This is the same color theory Adobe Photoshop® uses through an automatic, behind-the-scenes "Source Profile> Monitor Profile conversion process.

Photoshop and Firefox 3.6 can both display True Color on your monitor provided you have a fairly decent monitor and a properly 'calibrated' monitor ICC profile enabled.

FIREFOX's "Full Color Management" standard gives you a free real-world, high-performance professional color-managed viewing environment on the World Wide Web without the use of embedded profiles.

That statement is not hype — it is fact.

And the above Tagged WhackedRGB to Untagged sRGB rollover proves it through a dramatic visual comparison.

Firefox 3.6 (with Value 1 set) can also serve as a very accurate color-managed picture viewer that is every bit as equal to Photoshop in this example.

Try dragging your photo file icon into an open Firefox window.

That move should open the image in Firefox and display its "true color" (corrected through your monitor profile) — the same as Photoshop — as long as:

1) The file is un-tagged and based on sRGB, or
2) If the file has an embedded v2 ICC profile.

+++++++

IF YOU ARE HAVING TROUBLE UNDERSTANDING MY TERMINOLOGY please feel free to review my basic color management theory white paper.

By Apple® Mac references, I am talking about OS-X Snow Leopard 10.6 SL, Leopard 10.5, Tiger 10.4, 10.3, 10.2.

By Windows® references, I am talking about Windows 7, Windows Vista, Windows XP.

Not sure what GNU/Linux is based on, but I was emailed that it is Firefox-Mozilla's original platform.

+++++++

What is an ICC PROFILE?

Rather than explaining about ICC Profiles here, I will simply make these two basic statements to set up my next point:

1) ICC profiles interact with a Color Management System and tell it HOW to display color properly on a SPECIFIC DEVICE, and

2) The following rollover most clearly demonstrates what happens when a profile is stripped or ignored or not embedded (and a wrong Default profile is Applied-Assumed-Assigned).

The two Whacked RGB images in this roll-over set are EXACTLY identical EXCEPT the ICC profile has been stripped from the Un-Tagged version:

Move mouse curser on-off image to rollover examples.

If the bizarre blue "Un-Tagged Whacked RGB" image above is the same as its "Tagged" rollover mate your Web browser is NOT color managed.

If the horrid blue example rolls over to True Color, then your browser is color managing embedded ICC profiles properly.

Again, both images in this rollover set are identical EXCEPT one is "Tagged" with an embedded profile — the profile is telling the color management system how to display it properly.

In all browsers, the wrong Default profile is being Assumed to the Un-Tagged Whacked RGB — so it will always appear blue.

Using a color-managed browser, this rollover effectively demonstrates what happens when your software STRIPS or IGNORES embedded profiles.

The heavy violet color cast is how Whacked RGB displays raw and uncompensated when a monitor-type profile is wrongly Assigned-Assumed-Applied.

What is Whacked RGB?

Whacked RGB is a very strange theoretical color space intentionally "whacked out" by color experts to troubleshoot bad work flows, and learn about how Color Spaces interact within various types of applications, operating systems and proofing devices (like printers and displays).

Whacked RGB is arguably the BEST PROFILE for troubleshooting digital work flows because is nearly impossible for even lay persons to miss the huge blue warning when the workflow is bad because it is so different from any other color space in the real world.

REAL WORLD EXAMPLE:

HERE is a Tagged-sRGB to Untagged-sRGB rollover real-world test example for a SECOND OPINION.

If the sRGB rollovers display a visual dead-on match using OSX, your browser is either Fully Color Managed - OR - it is NOT color managed at all (think about that for a moment...:)

If the sRGB rollovers display even the slightest shift, the change between Tagged and Untagged sRGB (on a Mac) is the difference between your Monitor RGB and sRGB.

Not real sure about what happens on a PC Windows computer...but I believe Windows 7 and Vista will "match" the sRGB rollovers by Default.

The question is if Windows will CONVERT both tagged and untagged sRGB files to Monitor RGB for True Color display.

I suspect Windows just sends sRGB to the monitor without actually Converting it to the monitor profile....

LESSER color-managed browsers than Firefox 3.6 (value 1) will fail this sRGB test because:

They either "Assign" (Apply-Assume) Monitor RGB or sRGB to un-tagged color, but they do not CONVERT untagged color to Monitor RGB.

Again, FF3.6 (Value 1) "Assumes" un-tagged color is sRGB, and then it Converts it to the monitor profile.

Please click here for more in-depth study of ASSIGN Vs CONVERT TO PROFILE.

"Intellectuals solve problems, geniuses prevent them." - Albert Einstein

This "matching" of Untagged sRGB to Tagged RGB is what Firefox-Mozilla developers call "Full color Management" (Value 1).

Firefox is the only Web browser that can do this (at least on a Mac OS-X).

Firefox "Value 1" has the theory exactly correct.

This theory means Web publishers do not need to embed profiles (reducing bandwidth) on the Internet because Firefox Defaults to the sRGB standard and Converts everything to Monitor RGB.

SEEING IS BELIEVING:

Move your mouse cursor on-off logo to rollover test images.

LOOK CLOSELY: The closer your monitor is profiled to sRGB the harder it will be to see a color mismatch using standard color-managed browsers like Safari.

NOTE: My Tagged and UnTagged logo files are identical, except the UnTagged file does not have an embedded ICC profile, and the Tagged file has an embedded sRGB profile.

A real problem for web designers and color-managed Mac browsers has always been MIXING tagged and untagged color where the graphic background needs to match or blend into a filled box or page background color (as in this example).

FIREFOX 3.6 (Value 1) FIXES THIS PROBLEM, TOO!

My two logo backgrounds (Tagged and Untagged) are filled with the exact same AF641E Hex color.

The oversized table surrounding the logos is also filled with AF641E.

In all other color-managed Mac Web browsers, the logo rollovers will shift color, but as you can see, the Firefox "Full Color Management" settings I am demonstrating here eliminate this problem — the logos "match" the background in FF3.6 (Value 1) BECAUSE:

1. Firefox is DEFAULTING the UnTagged logo to sRGB and Converting (re-mapping) the color to your monitor profile.

2. Firefox is reading the embedded profile in the Tagged sRGB logo and Converting (re-mapping) it to your monitor profile.

3. Firefox is DEFAULTING the UnTagged AF641E background color to sRGB and Converting (re-mapping) it to your monitor profile.

TO EXPLORE MY CLAIMS FURTHER view this page in other modern top Web browsers such as GOOGLE CHROME, SAFARI, OmniWeb, Microsoft Explorer IE, CAMINO, OPERA. Most of these links contain free downloads to tryout these most popular Web browsers.

Standard color-managed browsers will show a shift between the TaggedRGB and Untagged sRGB (or if they match, they won't be displaying True Color because they are not also being "Converted" to MonitorRGB).

Un-managed browsers will "match" my logos with its reddish Hex background because all the numbers are based on sRGB and the same Default monitor profile is being assumed (but they won't displaying True Color because they are also not being "Converted" to MonitorRGB).

ONLY FIRE FOX 3.6 with my outlined settings DISPLAYS ALL THESE TEST FILES WITH 100% TRUE COLOR!!!

HOW TO SETUP & ENABLE VALUE 1 FULL COLOR MANAGEMENT IN FIREFOX:

Here is a free easy simple guide of instructions with screen shots how to set up and activate FULL COLOR MANAGEMENT VALUE1 in Firefox 4 & FF3.6x.

First update FIREFOX (6 5 4 or 3.6 or higher) and type in "about:config" into the Firefox Address bar.

Read the warning!

Filter List: Type in "gfx.color" to shorten list to the Firefox color-management options only.

Double+Click on the "gfx.color_management.mode" line and enter a "1" (one) in the pop-up box, close, and confirm Value=1 (as pictured in the above screen shot).

That's all there is to it!

Quit and restart Fire Fox — this page should now be Fully Color Managed (and behaving as described above).

+++++++

FIREFOX DEFAULT COLOR SETTINGS:

Above screen shot of the Fire-Fox 3.6.13 Default settings in case you need to back up or restore the FF Default color preferences.