Colour Picker

I've needed to get the exact colour (of a pixel) from an image.
Paintbrush for Mac can pick colours but they are incorrect. When its result is used as a background colour of a cell it is noticeably darker than the image.

There are many other online image colour pickers. Some exhibit the same flaw: providing incorrect colour values. The answer could lie in the confusing world of monitor colour profiles and sRGB vs. RGB colour space. Frankly I don't care. I just want an exact match. I want the colour data of a certain pixel.

I figured such a tool should be local (on my PC) and give correct, reliable results.
This is why I set out to create my Image Colour Picker.

Unfortunately, after looking into why colours aren't interpreted the same way across all tools I learned more about the bewildering world of colour rendering and interpretation. It turns out my program fares no better than the other image colour pickers I found. See more about browser compatibility and how different colour pickers see colours differently.

 ESCAPE='HTML'

NOTE: To avoid security error regarding use of cross-origin data you must download colourpicker.html to your local drive. Right-click on the link below and choose Download Linked File As... to save it to your computer. Then you can open that file in your browser and start using the tool with your local image files.

There may still be a security cross-platform error when loading an image. You will have to strip the 'Where from' attribute from colourpicker.html. There may be work-arounds found elsewhere on the internet.

Features:

* Uses local images you have on your hard drive. No need to upload your images. No need for an internet connection.

* For transparency colour it displays 8 digit hex code. Check browser support

* Magnifies up to 8x to pinpoint exact pixel.

* Displays hex, rgb, rgba, hsl, hsla (CSS color value or JavaScript string)

Colour Interpretation Problems

Looking into the varying colour interpretations that image colour pickers give, I have discovered the confusing world of browser compatibility, browser's rendering of pages, and browser's JavaScript differences. Due to legacy issues and lack of standards it is no wonder that the online colour pickers don't agree on colours. This makes very few of them, and only under limited conditions, truly reliable.

It seems that the best combination is when a certain browser is looking at an image that was generated by that same browser. Firefox and Chrome did well. Safari could not come up with a match.

The table below summarizes the many different colour interpretations different colour pickers running on different browsers and attempting to read images rendered by different browsers.

They are all trying to interpret the colour (246,167,54) - a bright orange.

In the table red indicates bad.

Image Rendered by
SafariFirefoxChrome
Paintbrush242,151,44233,152,59242,150,42
Safari runs ↓
colourpicker247,168,56240,169,75247,167,54
colorcodepickerscalingscalingscaling
ginifab247,168,56240,169,75247,167,54
html-color-code247,168,56240,169,75247,167,54
csscolorpicker247,168,56240,169,75247,167,54
colorcode.isno openno openno open
Firefox runs ↓
colourpicker254,166,9246,167,54254,165,0
colorcodepicker254,166,9246,167,54254,165,0
ginifab254,166,9246,167,54251,163,0
html-color-codeno openno openno open
csscolorpicker254,166,9246,167,54254,165,0
colorcode.is254,166,9246,167,54254,165,0
Chrome runs ↓
colourpicker246,168,56239,168,75246,167,54
colorcodepicker246,168,56239,168,75246,167,54
ginifab246,168,56239,168,75246,167,54
html-color-code246,168,56239,168,75246,167,54
csscolorpicker246,168,56239,168,75246,167,54
colorcode.is246,168,56239,168,75246,167,54

These are the colour pickers tested:

colourpicker - My own program. NOTE: Chrome will issue an error. There is a work-around.

colorcodepickerhttps://www.colorcodepicker.com​

ginifabhttps://www.ginifab.com/feeds/pms/color_picker_from_image.php

(The above no longer available)

html-color-codehttps://html-color-codes.info/colors-from-image/

csscolorpickerhttps://www.csscolorpicker.com

(The above no longer available)

colorcode.ishttp://colorcode.is/from/image

The following online tool did not render the image correctly. It was converted to a jpg file. The colour could not be sampled properly.

imgcolorpickerhttps://imagecolorpicker.com

Revised 14 Mar 2020