Jump to content

ImageColorThief - Extract dominant color(s) from a Pageimage


Recommended Posts


I was originally going to include this as part of my forthcoming AdminStyleChroma module but decided to roll it out as its own module.


Please check out the readme for a deeper explanation - but the short version here for now:

This module adds two new methods to the Pageimage class, allowing you to extract the main dominant color or a palette of prevalent colors from an image.

You can use the entire image to evaluate color dominance, or you can use a select swatch from the image based on inset rectangles from the edges, blocks at each corner, or a swatch centered on the focus point if you choose to use it. You can also select the granularity of the quantization to get more accurate color results.

This is not an eyedropper algorithm - the colors are close approximates. Great if you have color schemes you'd like to coordinate with the headliner or seasonal images, or if you'd like to be able to sort a gallery of images by dominant color, etc. Looks real nice, for example if you are running a ken burns style image fade background and the images are sorted by a channel, etc.

How to sort them? Ugh that's something I haven't tackled - yet: https://www.alanzucconi.com/2015/09/30/colour-sorting/

It works on JPG, GIF, PNG and WEBP images.

It outputs RGB, HEX, RGB Integer, raw Array with R, G, B elements or an object.

Once I've got myself registered and whatnot I'll submit it to the Modules Directory.

Installs from zip for now: https://github.com/solonmedia/ImageColorThief/archive/refs/heads/main.zip

I'd consider it Beta - the underlying libraries are pretty stable but I'd like to run a few more tests on input.

Let me know if you have any questions/thoughts.

  • Like 16
  • Thanks 2
Link to comment
Share on other sites

Very glad to see this module featured and immediately had a use for it. However when using it with Combo field from ProFields module (processwire.com/store/pro-fields/combo/) with an image upload field - it throws an exception:

Exception: Method ComboValue::getFile does not exist or is not callable in this context

My guess is the Combo field uses it's own custom properties or methods for field data.

  • Like 1
Link to comment
Share on other sites

I am a profields user so I will take I look. Can you give an example of the call that is throwing the error?

Never mind, I see the issue. When I grab the unformatted field value for the event gives back the combo field itself, not the image subfield within the combo.

I'll see what I can figure out.

  • Like 1
Link to comment
Share on other sites

So I can get calculations on images in combo fields on the fly, I'm having trouble saving the data back into filedata - still waiting to hear back from someone who is better with Combo to help there. I've tried a lot of different methods but it looks like there are extra hooks tied to the combo that throw errors similar to what you were seeing.

I can put out a version without the caching feature for combo fields if folks want it - I would just recommend being relaxed with the quality because you will be doing real-time calcs each time.

Regular image fields are not affected by any of this.

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...