Electron Projects

Transparent windows

Given that we are working on the screenshot snipping tool, it is vital to be able to select an area of the screen to create a screenshot. Traditionally, such tools offer a transparent and resizable window so that users can imagine the result more clearly.

You can enable window transparency by using the transparent property like so:

function createWindow() {  win = new BrowserWindow({    transparent: true,    frame: false  });  win.loadURL(`http://localhost:3000`);  win.on('closed', () => {    win = null;  });}

Please note that transparency mode has its own platform-specific limitations. You can find all the details here: https://electronjs.org/docs/api/frameless-window#limitations.

However, if you try to run your application right ...