Making widget icons work - how to prepare them, so that setcolor will change their color?

I would like to produce a widget icon with similar properities to the Bluetooth widget ICON. Its not clear how this icon is contructed. What size is it in terms of pixels when downloaded from icons8.com. The outline of the icon can change color by using set color. I have tried all 3 of the attached icons from icon8 and none of them will display. They all end up black on black. I am wondering what it is that has to be done with the png file from icon8 in order to make the color change when using setcolor() ?

This one is 32x32.

1 Attachment

this one is 48x48

1 Attachment

this one is 16x16

1 Attachment

The trick is not the size, so much as how to import the image using the image converter.

Generally I:

• Invert the image in a paint program so it's white
  
• Rescale it in a paint program so it's maybe 20x20px (widget bar is 24px)
  
• Use the image converter as 1 bit, or 2 bit greyscale
  
  

Using 1 or 2 bit means Espruino will then draw it using the current color.

There's also a 'beta' image converter with a few more features at https://espruino.github.io/EspruinoWebTools/examples/imageconverter.html

One of those is 'invert' - so you can skip the external inversion step.

thanks, the new image converter is very handy to save that invert stage, it means I dont have to jump onto a limux machine and use GIMP.