Tuesday, September 28, 2004
Colour Casting
I’m looking at colour again. In the design scheme for one of the web sites that I maintain, the colour specified in the design manifesto is ‘Pantone’ 644. In this branding document, the specification of this colour for the web is RGB: 44% 62% 73%. I don’t usually specify colour in CSS as RGB but rather as HEX. However, I am curious, because if these RGB values are pumped into Photoshop, then the colour is all wrong. So how does this come about?
furthermore...
You need to know that when colour is expressed as a combination of the three red, green and blue colours, they can have values between 0 and 255. Percentage values are OK but for Photoshop they would need to be calculated as percentages of 255.Now for a few tools.I use an application called 'Art Directors Toolkit' (MAC OSX only) and this give me a result that looks like this:
Not bad but not good. I can't show you the comparison of the print version, but believe me, it doesn't work.The Art Directors Toolkitgives a better interpretation of the Pantone colour specified.
Another tool worth looking at is ColorSchemer Studio (for MAC and PC). Their website has trial versions and tutorials. ColorSchemer does not make reference to Pantone colours, so this is not useful in the context described above.Web safe or Web Smart?Once upon a time most computers could only display 256 colours, and within a web browser even less. Nowadays we expect our computers to display thousands or millions of colors. Web safe colors are so called because they will display, without dithering, within the 216 colours allowed. This palette of colours is sometimes referred to as the web-safe palette and is used on '8bit' colour displays (few of the these systems are used in 2004).
Web-smart colours, on the other hand, are colours that will fit into the palette of 4096 colours 
Extra words from :
You wrote that ‘Web-smart colours’ will fit into the palette of 4096 colors without dithering on 16-bit displays. That’s not true when they are specified as CSS or HTML background colors.
In your “Further Information” section you have a link to the Web Colors Homepage at Freeserve. Try out their 4096 color picker in 16-bit mode on a Microsoft Windows system. I’ve done it. Most of the so-called ‘Web-smart colors’ will dither. At the same site there’s also a 16-bit (65,536) color picker. None of those colors dither. I use Datastic.com’s Color Cop to magnify the background and display the pixel color values simultaneously. The explanation why ‘Web-smart’ colors are not safe is simple. In 16-bit mode Red & Blue can only have the least significant digit as 0 or 8 (unless it’s FF). Green can be 0, 4, 8 or C.
In CSS, but not HTML, you can abbreviate three ‘paired’ digits to a hex triplet. For example CC6633 could be specified as:
h1 { color:#C63 }
Maybe I’ve missed something, but that’s as ‘smart’ as it gets. In 16-bit mode that particular color would ‘dither’ unless it was specified as #C86830.
Posted on 10/13 at 09:50 PM
Extra words from :
Many thanks to Brad for this explanation. It’s funny ‘cos I did notice dithering with a ‘web smart’ color. But I guess I was in too much of a rush to really investigate properly!
Posted on 10/14 at 09:24 AM
Extra words from :
I made some mistaken statements in this article. Brad’s comments set me on the trail of a MAC OS x screen magnifier and I found Coloristic over at http://www.bubblepop.com/
The truth is that in ‘thousands of colors’ mode, just about everything magnifies as dithered. So, I suspect something else is going on.My hardware - Apple G4 with display normally set to ‘millions of colors’. All fine. But set to ‘thousands of colors’, magnify the screen and all but the basic colours are dithered.
Posted on 11/07 at 07:05 PM
Extra words from :
It’s great that you found an equivalent screen magnifier/color picker for Mac OSX. I think I will email the webmaster at the webcolor.freeserve and suggest s/he adds it to the links page, along with Datastic.com’s Color Cop.—Brad
Posted on 11/13 at 01:29 PM
Extra words from Kerry:
Brad emailed me to suggest Bubble Pop’s Coloristic for my links page. When I visited the site it mentioned a purchase fee of $12. Did you have to pay for it, Chris? My policy is to recommend freeware unless there is really no alternative to a neat commercial product. I use Windows, but I came across a link to an article about a built-in tool for Mac OSX called “The Colors”. As I recall, I found the link on Jemima Chevron’s site a while back:
http://www.codepoetry.net/archives/2004/08/02/the_colors.php
Apparently, this native utility provides the same features as Coloristic plus many more.
Posted on 11/23 at 05:36 PM
Extra words from :
I didn’t purchase Colorstic - I just wanted to check it out as an alternative to the Windows software that Brad suggested. I don’t intend to use it at present.
Thanks for pointing out codepoetry to me I need to have a look at that site - really good. The Colors article there is really just dealing with the color palette tool that comes along with MAC OSX.
Posted on 11/23 at 09:56 PM