Register now for better personalized quote!

How to copy colors on macOS with System Color Picker

Jun, 09, 2022 Hi-network.com
David Gewirtz/Screenshot

Recently, myZDNetcolleague Lance Whitney wrote about how to copy colors with the Color Picker tool in PowerToys.PowerToys, of course, is a much-beloved Windows add-on. But if you're a Mac user, it turns out there's an equally useful tool available called System Color Picker, a free Mac App Store app by developer Sindre Sorhus. 

That's what we're going to talk about here.

Getting started with System Color Picker

Like all Mac App Store apps, installation is a breeze. Just point yourself at the app and press Get. I have mine installed, so it says Open instead.

When you first open System Color Picker, it presents a color picker window. We're going to ignore that and tweak a few settings first. Go up to the menu bar and select Preferences. 

You'll see this window:

David Gewirtz/Screenshot

Obviously, you can choose whatever you want, but I found I like these settings because it keeps the color picker on top of all the other windows and is accessible from the menu bar. Since it's something I use all the time, I far prefer that over the dock icon.

David Gewirtz/Screenshot

Now that System Color Picker is set up, it's time to pick some colors. All you need to do is choose Pick Color from under the droplet icon and then move your cursor over the color you want to pick up and click.

David Gewirtz/Screenshot

As you select colors, they get added to the Recently Picked Colors menu, which retains the last six colors you picked.

David Gewirtz/Screenshot

If you want to insert the color into your design, you have a bunch of options. These are all controlled by the Color tab of the System Color Picker Preferences tab.

David Gewirtz/Screenshot

As you can see, you can turn on and off a bunch of formatting options for how you want the code to be placed in your clipboard.

Because I do a lot of web development, I generally like capturing the hex code and formatting it without the hash mark. That's because I'm so used to typing#before my colors that I wind up with color codes like##297fec in my code, which is not what I am looking for. Leaving out the hash mark also works well when specifying colors inPhotoshop .

Also:How to resize your images quickly and easily

David Gewirtz/Screenshot

Finally, let's take a look at the selection window we saw when the app launched for the first time. You can bring this up anytime by selecting Toggle Window.

David Gewirtz/Screenshot

That gives you the full-featured color window common to most Mac design applications.

And there you go. You can do color selection from the Finder on macOS, just like Lance showed us for Windows.

Is this a tool you're likely to regularly use? It is for me. What other helpful little Mac utilities do you rely on? Let us know in the comments below.


You can follow my day-to-day project updates on social media. Be sure to follow me on Twitter at @DavidGewirtz, on Facebook at Facebook.com/DavidGewirtz, on Instagram at Instagram.com/DavidGewirtz, and on YouTube at YouTube.com/DavidGewirtzTV.

More how-tos

How to set up and use Meta's Threads as a Windows 11 desktop app3 essential Windows tools for troubleshooting (and how to use them)How to use iOS 17's 'Live Voicemail' transcriptions, and which iPhones support itBing Chat now has the highly-requested dark mode. Here's how to turn it on
  • How to set up and use Meta's Threads as a Windows 11 desktop app
  • 3 essential Windows tools for troubleshooting (and how to use them)
  • How to use iOS 17's 'Live Voicemail' transcriptions, and which iPhones support it
  • Bing Chat now has the highly-requested dark mode. Here's how to turn it on

tag-icon Hot Tags : Services & Software Creativity Software

Copyright © 2014-2024 Hi-Network.com | HAILIAN TECHNOLOGY CO., LIMITED | All Rights Reserved.