138

I used to find color codes which I want to use for texts or background colors on htmls with color edit tool of MS paint which pre-installed on Windows.
But now I use Mac instead of Windows.
How can I find color codes with Mac?
Is an software like MS paint pre-installed on Mac?

Improve this question

8 Answers 8

Reset to default
242

There is a utility (in Applications/Utilities) called Digital Color Meter, which shows the color code of whatever you're hovering at the moment. It's a bit more lightweight than Preview. There are also shortcuts for copying the color value as a string (⇧+⌘+C) or image (⌥+⌘+C).

Improve this answer
7
  • 4
    And this is far better than the MS Paint option
    – Nivas
    Jun 29, 2011 at 8:23
  • 1
    thank you very much. this is a really very nice tool than ms paint! i bought my first mac and sold windows only 2 weeks ago. and i miss windows for windows was easy to use for me. i hope there are a lot of better things which i dont know yet on mac.
    – js_
    Jun 29, 2011 at 16:39
  • can i modify(for example, make it brighter or more grayish) picked color with Digital Color Meter?
    – js_
    Jun 29, 2011 at 17:40
  • @js_ FYI, when you mention "make it brighter" or "more grayish" you want to use a HSL color model. Here's an online tool: hslpicker.com where you can type in the rgb values from your Digital Color Meter and then adjust Saturation ("greyness") and lightness.
    – ghoppe
    Jun 29, 2011 at 22:33
  • 5
    If you're looking for HEX codes for web work e.g. #e5e5e5, it can be found under View -> Display Values in the Digital Color Meter.
    – pscl
    May 25, 2018 at 7:39
36

The Digital Color Meter in /Applications/Utilities/ is the best choice.

enter image description here

Color panel - picker

This picker is almost everywhere enter image description here if you look carefully.

Look closely at font controls and you will likely see wording like Format -> Font -> Show Colors, or Format -> Show colors. (The shortcut is usually ⇧⌘C). You will get the small color panel shown above, where you can click the "magnifying lens" and you can grab the color from anywhere in the screen. for example: TextEdit, Pages, Mail etc... This is a clipboard to save colors, but doesn't report hex values, CIE values or the ITU-R Y'PbPr/Y'CbCr values for the chosen color.

Everywhere when you can show the font panel (usually ⌘T), you can click the "Text color" icon in the font panel and you will get again the "Color panel" (with picker).

You can for example when entering text into textbox here, right click for bring up contextual menu, and go to "Font -> Show colors" directly from the Safari... This works in every application where you can change fonts.

In every application where you can change the color for anything with color field, you can click the border of "color field" and you will get the color panel again. For example Terminal.app -> Preferences -> Settings (color fields for text and Cursor colors)

You can download a some cool color-helper dasboard widgets, like: colourmod or ColorTheory.

You can download a plugin into color panel for hexadecimal color values.

If you find yourself needing the DCM often, you might look at using Automator.app to create a global "Service" that launches the Digital Color Meter.app. Now you are a few clicks away and can additionally bind this new service to a global hotkey in the System Preferences. The result: running DCM from anywhere, anytime, on a custom key command.

Here are several more things - but lastly: you can also run Windows in VirualBox and use the MsPaint method. /joking/ - be cool. :) :)

Edit: added another screenshot with color profiles enter image description here

Improve this answer
5
  • thank you for your answer and edit. i wanna pick a color from screen, modify it, and know its rgb value or color code. the wigets looks nice. but first i wanna try the combination of DCM and color panel to do that. but when i open DCM window, the color panel window disappear. so i cant know rgb value of the color which i picked and modified with color panel. what should i do? by the way, i dont know how to use automator.
    – js_
    Jun 29, 2011 at 17:34
  • And yet neither of these actually work; the colors they sample are too dark. If I sample a color, change the thing to be the report color, and sample it again, the color changes. No filters or anything on the "image" -- I wrote a custom app which literally does nothing but paint the window with the exact RGB value specified. And the change isn't small, either; it's noticeably darker.
    – anon
    Nov 21, 2018 at 18:06
  • @NicHartley Actually, all of the above works. If you got changed colors between two sampling, your display isn't calibrated or has the default color profile. Try Step-by-step: 1.) System preferences -> Displays -> Color(TAB), 2.) Choose: sRGB iEC61... 3.) open Textedit set some text to specified color let say 250,150,50 (with sliders) 4.) sample the color and you should get again 250,150,50. The same applies for the Digital Color Meter app. Set the popup to display in sRGB - and it will show also the same numbers. So, both of the above works, just need use the same color profile. :)
    – clt60
    Nov 22, 2018 at 22:55
  • I picked a color. I set a box to be that color. I sampled the box. I set the box to be that precise (slightly darker) color. I sampled the box again, and got a third, still darker, color. I even tried with a few builtin, Apple-brand apps, in case they're doing their toxic vendor lock-in stuff again, and I got the exact same results. All on the default, built-in display that came attached to the Macbook. The same thing happened with both methods. If you call that "working", sure, I guess it works.
    – anon
    Nov 22, 2018 at 23:11
  • @NicHartley Honestly, do not understand fully your comment, but as you can see in the attached screenshot, the sampled colors has the same rgb values set manually (250,150,50) and later in the samplings. Could you write some "how to reproduce" the "don't work"? (Like as I added the correct way of setting for sampling). Simply, you can't mix together different color profiles. So, setting some RGB values (let say) in the adobe profile must result an different color (different RGB values) in the sRGB profile. See my previous comment and the screenshot - how to set the sRGB for your display.
    – clt60
    Nov 25, 2018 at 18:46
3

I prefer RCWebColorPicker extiesion, check it here: http://www.rubicode.com/Software/RCWebColorPicker/

screenshot

Improve this answer
1
  • Benefits: easy to copy/paste in or out, smart enough to handle the 3-char form (e.g. turning 39C into the above 3399CC), and accepts lower or upper case. I've been using it for ages, and it still works fine in Mavericks.
    – Scott Lawton
    Dec 22, 2014 at 23:46
2

This has now gone out of business first renamed to Hues then out of business http://giantcomet.com/hues/

I quite like the completely-free app Spot Color. It uses the Mac's built-in color pickers and allows you to grab the color and then use the various sliders and color models to modify it, as you asked about in your followup comment.

Spot Color App screenshot

Since it uses the Mac's color pickers it means you can also use any of the various additional color pickers out on the web, such as:

Hex Color Picker

Spot Color with Hex Color Picer

and Developer Color Picker

Spot Color with Developer Color Picker

Improve this answer
1

Just Color Picker

It is a free app in the app store.
https://itunes.apple.com/pl/app/just-color-picker/id886547068?l=pl&mt=12

It does the job for web developers! Just press "Alt + X" to freeze the value under your mouse. By default, it picks the value as hex decimal code, like #F7F8F9 for instance.

Very simple and straight to the point. Love it.

Improve this answer
0

Try Just Color Picker from annystudio.com http://annystudio.com/software/colorpicker/

Great app! I have it on both Windows and Mac - works like a charm..

Improve this answer
-1

Here is an HTML document with the named colors...

Improve this answer
1
-2

There is an App called Preview pre-installed where you can get the colors from.

Improve this answer
3
  • 1
    thank you for your information but i couldnt find the way to get the colors with Preview. which command on menu should i execute?
    – js_
    Jun 29, 2011 at 16:13
  • Preview offers a very roundabout way to copy a color, but it still doesn't show hex values. The best it can do without a plug in is turn on annotate, make an annotation on any file that's open in the document, then choose color, then click on the magnifying glass. It like many programs call the API for a color picker / palette manager.
    – bmike ♦
    Jun 29, 2011 at 16:38
  • what is annotation?
    – js_
    Jul 1, 2011 at 0:57

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .