It is no doubt that electron’s default showing of titlebar and control buttons doesn’t look good on Windows.

In this article, I will introduce a new feature in Electron Windows Controls Overlay that will make the titlebar look more native.

TL;DR

const win = new BrowserWindow({
  titleBarStyle: "hidden",
  titleBarOverlay: {
    color: "#2f3241",
    symbolColor: "#74b1be",
    height: 60,
  },
})

To update the titlebar color, you can use the win.setOverlayIcon(overlay, description)