Changing electron app icon

Source: IMDb

Generate icns

• Generate .iconset You can use IconGenerator
• Run iconutil -c icns “Icon.iconset”. Note that icon names must be first letter lowsercased, and use _ instead of -

Use icns

• In main.js, specify icon

win = new BrowserWindow({
 width: 800, 
 height: 600,
 icon: __dirname + ‘/Icon/Icon.icns’
})

You can also use helper url methods

const path = require(‘path’)
const url = require(‘url’)
const iconUrl = url.format({
 pathname: path.join(__dirname, ‘Icon/Icon.icns’),
 protocol: ‘file:’,
 slashes: true
})

If app icon is not updated

• I get a problem that electron always shows default app icon. I tried using png, NativeImage, different icon sizes but still the problem. When I use electron-packager to make release build, the icon shows correctly, so it must be because of Electron caching or somehow 😠
• Go to node_modules -> electron -> dist, right click on Electron, choose View Info
• Drag another icns into the icon on the top…