How to get a perfect sized tray icon using electron？

Question

I've tried 32x32, 64x64, and I've tried to use Photoshop to edit another app's icon into my icon to keep its size but it never works with me. It seems that my icon is double-sized and I can't get the whole icon to be visible.

Answer 1

You can append @2x after image's base filename to mark it as a high resolution image.

This was helpful for me: https://www.electronjs.org/docs/api/native-image#high-resolution-image

Answer 2

16x16 png will work fine for Macos tray icon. You can also have @2x 32x32 png for high-resolution displays, e.g. 16x16 'tray.png' and 32x32 '[email protected]'.

P.S. You can easily convert your icons on iConvert Icons.

Answer 3

  const image = nativeImage.createFromPath(
    path.join(__dirname, "your-path/icon.png")
  );
  tray = new Tray(image.resize({ width: 16, height: 16 }));