At times, you absolutely need to find out what shade of colour an image or website uses. This is especially important if you’re a graphic designer or need to become one for a little project for your business. How do you go about picking the exact shade of colour? Good question! This article will explain how to do this on MacOS.
Let me introduce you to Digital Colour Meter
If there’s one thing that Apple wants to make clear is that it wants its products to appeal to creative types by including a few utilities that those professionals will find useful in their day-to-day work. Digital Colour Meter is one of those utilities: it allows you to capture a specific colour and will return is Red, Green and Blue values so that you can use them to fine-tune the colours you use in your graphical projects.
The way it works is very simple: it’s a single-window utility that will tell you the shade of colour placed under your mouse cursor. You may choose among a set of profiles, but you’re generally safe by just using Generic RGB. Colour profiles are a rather complicated and niche topic and I won’t even pretend to know what I’m talking about. Once your cursor is above the colour you want to pick, press Shift + Command + C and it will be copied as text. If you need those values in decimal form, you’re pretty much good to go: just copy them somewhere and use them as reference or whatever.
Converting Digital Colour Meter values to hexadecimal
If you’re working on a website or an app, chances are you don’t have much use for the decimal values that Digital Colour Meter produces. In those instances, values in hexadecimal are much more useful and practical.
In case you don’t know, hexadecimal is a numeral system with base 16, meaning that it uses 16 digits instead of the 10 we’re all accustomed to. If you’re wondering what those extra 6 digits are, they’re simply letters from A to F. The good thing about hexadecimal, and the reason why it’s so much prominent in computer science, is that converting binary values to hexadecimal, because 16 is an exponentiation of 2 (namely, 2⁴). What this means in practice is that one hexadecimal digit corresponds to 4 binary digits (or bits), making conversions between the two numeral systems very easy. By comparison, converting between base 2 and base 10 is much more difficult.
Generally, you can easily tell apart hexadecimal values because they have a leading hash (#) or 0x.
Open MacOS calculator app and select View > Programmer. This will let us convert values from base 10 (decimal) to base 16 (hexadecimal). Type in the first value you got from Digital Colour Meter, then click 16. This will convert your decimal number to hexadecimal. Disregard the leading 0x, since we don’t need it, and write the number down. Repeat with the other two numbers.
For example, white has a code of 255 255 255. In hexadecimal that would be FF FF FF. To use that value in a webpage, you only need to write it with a leading # and no spaces, like #FFFFFF.