I was trying to “blend” a widget into the sidebar of this blog. No problem, I thought, I’ll go to the wonderful Element Inspector, and find out the current background color. I got the RGB value from the Inspector, converted it to Hex using exColor and sampled it, but the resultant color wasn’t the sidebar background color at all. The value matched the one specified in the CSS file for the sidebar alright, but the result on-screen was quite different from how it shows up in the blog! Intriguing.
Obviously, there are some intricacies of CSS at work there which I don’t quite comprehend at this point (the behaviour is consistent across all browsers). I promise to dig into that later and post my findings around here. However, the show had to go on – I needed to find out the color being actually displayed on screen and use it! So I set out trying to find a utility that could identify the color of any pixel on screen. On a whim, I typed “color” in QuickSilver and stumbled into /Applications/Utilities/DigitalColor Meter.app.
It does just what I said – tell you the exact value of any pixel on screen in RGB (absolute, percentage or hex) as well as other models. Have it running in the background and move your mouse to the pixel of your choice in any application. Just switch the focus back to DigitalColor Meter and you should see the color value corresponding to the pixel under the mouse pointer in the application last in focus. It has keyboard shortcuts to “hold” the current color value or to “lock” the focus of the mouse to the current pixel position, as well as copying the current color value to the clipboard – explore the menus, it’s quite simple and intuitive, really.
A word of warning though – do NOT keep it running in the background unnecessarily, not without putting it on hold at the least. Since it keeps updating itself as you move your mouse around and/ or switch applications, the whole process can take a toll on your CPU usage if done continously for long periods of time.
Another great utility that comes free, pre-installed on your Mac!
PS – For the record, ths sidebar color specifed is #666666. What you see is #ECFDCE.