#51 · closed · 2 comments
I have a transparent png file where I want to extract the colors from. But when I call the function, it only returns an empty array. I think this is due to the many transparent pixels, in comparison to the actual colors. Do you know, how I can fix this issue? I included an example image below. Thanks for any help already in advance! <img width="1024" alt="_Eyeshadow_2 0-8" src="https://github.com/user-attachments/assets/142e7615-c230-41a3-8543-40561b8d34aa">
Hello @felixranesberger, This behavior is normal: `extract-colors` extract by default only opaque colors and in your image all colors seems to have transparency. But you can change this behavior with the config of `extract-colors`: The function `colorValidator (red: number, green: number, blue: number, alpha?: number) => boolean` filter colors and exclude transparency colors. You can overide this function with the options of `extract-colors` to use transparency colors too. Here an exemple: ```ts import { extractColors } from "extract-colors"; extractColors('./transparent-image.png', { // This function filter colors your custom needs colorValidator(red, green, blue, alpha) { // all colors with transparency > 128 / 256 will be used return alpha > 128; // if you need all colors return true // return true }, }) .then(console.log) .catch(console.error); ``` I've do [a test with your image on codesandbox](https://codesandbox.io/p/devbox/beautiful-tu-5zn47c?embed=1&file=%2Fsrc%2Fmain.ts) and it's working 👍️ You can found the [documentation about `colorValidator()`](https://extract-colors.namide.com/guide/#color-validator) on the website. Does this config works in your case?
Works like a charm! Thanks so much for the help! ❤️