Transparent window

To create transparent window in Electron, two steps are required:

  • When creating BrowserWindow, set transparent property, i.e.:
const BrowserWindow = require('electron').BrowserWindow;
myWindow = new BrowserWindow({
    name: "My app window",
    width: 500,
    height: 250,
    transparent: true,
    frame: false,
    toolbar: false
});
  • For your main window HTML file, define CSS to make background transparent:
html, body {
    background: rgba(0, 0, 0, 0);
}

That's it!

Read More