Jump to page content

Colour blending foobars

I have always had this niggling feeling that there was something the matter with the almost-flagship two-colour blend feature in Colour Selector, but I could never put my finger on it. I have finally realised what is going on: the luminance value can dip in the mid range of a blend.

This is best illustrated with a red (#F00) to lime green (#0F0) blend. You can see from the following screenshot of Colour Selector that the blended colour looks considerably darker than both the red and the green:

Using Eric Meyer’s Web-based Color Blender tool, I have produced a 10-step blend from red to green, clearly illustrating the drop in luminance:

Colour Selector uses Hue-Saturation-Value instead, and the value (the brightness of the colour) drops from 255 (100%) of red and green to 126 (49%) for a 50% blend of red and green. Clearly I am not the only person to make this mistake!

After unsuccessfully researching for a better algorithm on the Web, I decided to see what Photoshop 5 did:

You can see a dark halo around the text where the anti-aliasing in Photoshop 5 for Macintosh is using clearly flawed colour blending. This is scary stuff! (Photoshop 5 also shows the same problem if you place a red layer over a green layer and set it to 50% opacity.) I decided to test Mac OS itself, so I created a simple Web page with green on red text and passed it to iCab 3 in Mac OS 9.1, which uses Apple’s ATSUI Unicode engine. Surprisingly, the results showed the same error!

Good grief. As a last resort, I went to Windows Paint and tried the same test again. Would you believe, that Windows Paint was the first test that succeeded?

You can see that the luminance is correct: the anti-aliasing is smooth with no dark halo. I tested Internet Explorer and Firefox too and both passed, so I imagine that in fact the correct algorithm lies not in the feeble Paint but in Windows’s GDI. I was rather dismayed when I first realised that Colour Selector was defintely broken, but it is vaguely reassuring that both Apple and Adobe failed to get it right after years and years of work! I don’t want to think about Microsoft being smarter and more observant than the other two companies and Eric Meyer however (or me for that matter!) Ouch.

I can’t test this in all the different GUIs (and text rendering libraries) myself, but to satisfy your curiosity, here is a test running on your own OS right now:

This is a test

See for yourself whether your own machine is capable of getting this right. I have no idea how to get it right in terms of the blend algorithm though, and by what method I can achieve proper perceptual colour blends with maintained luminance. The solution eludes me; I suck at Google :)

As an extra note: I just tried the above test in Mac OS X Tiger using both Safari and a recent iCab build and it fails in both, so evidently Mac OS X’s text rendering is also up the creek! I guess I am wholly vindicated by this discovery.

(Oh and apologies for the visual assault of horrible colours! heehee)