Header menu logo fable-electron-docs-api

BrowserWindowConstructorOptions Type

Namespace: Fable.Electron
Assembly: Fable.Electron.dll
Parent Module: Types
Base Type: obj

Constructors

Constructor Description

BrowserWindowConstructorOptions(?webPreferences, ?paintWhenInitiallyHidden, ?width, ?height, ?x, ?y, ?useContentSize, ?center, ?minWidth, ?minHeight, ?maxWidth, ?maxHeight, ?resizable, ?movable, ?minimizable, ?maximizable, ?closable, ?focusable, ?alwaysOnTop, ?fullscreen, ?fullscreenable, ?simpleFullscreen, ?skipTaskbar, ?hiddenInMissionControl, ?kiosk, ?title, ?icon, ?show, ?frame, ?parent, ?modal, ?acceptFirstMouse, ?disableAutoHideCursor, ?autoHideMenuBar, ?enableLargerThanScreen, ?backgroundColor, ?hasShadow, ?opacity, ?darkTheme, ?transparent, ?type, ?visualEffectState, ?titleBarStyle, ?titleBarOverlay, ?accentColor, ?trafficLightPosition, ?roundedCorners, ?thickFrame, ?vibrancy, ?backgroundMaterial, ?zoomToPageWidth, ?tabbingIdentifier)

Full Usage: BrowserWindowConstructorOptions(?webPreferences, ?paintWhenInitiallyHidden, ?width, ?height, ?x, ?y, ?useContentSize, ?center, ?minWidth, ?minHeight, ?maxWidth, ?maxHeight, ?resizable, ?movable, ?minimizable, ?maximizable, ?closable, ?focusable, ?alwaysOnTop, ?fullscreen, ?fullscreenable, ?simpleFullscreen, ?skipTaskbar, ?hiddenInMissionControl, ?kiosk, ?title, ?icon, ?show, ?frame, ?parent, ?modal, ?acceptFirstMouse, ?disableAutoHideCursor, ?autoHideMenuBar, ?enableLargerThanScreen, ?backgroundColor, ?hasShadow, ?opacity, ?darkTheme, ?transparent, ?type, ?visualEffectState, ?titleBarStyle, ?titleBarOverlay, ?accentColor, ?trafficLightPosition, ?roundedCorners, ?thickFrame, ?vibrancy, ?backgroundMaterial, ?zoomToPageWidth, ?tabbingIdentifier)

Parameters:
    ?webPreferences : WebPreferences - Settings of web page's features.
    ?paintWhenInitiallyHidden : bool - Whether the renderer should be active when show is false and it has just been created. In order for document.visibilityState to work correctly on first load with show: false you should set this to false. Setting this to false will cause the ready-to-show event to not fire. Default is true.
    ?width : int - Window's width in pixels. Default is 800.
    ?height : int - Window's height in pixels. Default is 600.
    ?x : int - (**required** if y is used) Window's left offset from screen. Default is to center the window.
    ?y : int - (**required** if x is used) Window's top offset from screen. Default is to center the window.
    ?useContentSize : bool - The width and height would be used as web page's size, which means the actual window's size will include window frame's size and be slightly larger. Default is false.
    ?center : bool - Show window in the center of the screen. Default is false.
    ?minWidth : int - Window's minimum width. Default is 0.
    ?minHeight : int - Window's minimum height. Default is 0.
    ?maxWidth : int - Window's maximum width. Default is no limit.
    ?maxHeight : int - Window's maximum height. Default is no limit.
    ?resizable : bool - Whether window is resizable. Default is true.
    ?movable : bool - ⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ || Whether window is movable. This is not implemented on Linux. Default is true.
    ?minimizable : bool - ⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ || Whether window is minimizable. This is not implemented on Linux. Default is true.
    ?maximizable : bool - ⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ || Whether window is maximizable. This is not implemented on Linux. Default is true.
    ?closable : bool - ⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ || Whether window is closable. This is not implemented on Linux. Default is true.
    ?focusable : bool - Whether the window can be focused. Default is true. On Windows setting focusable: false also implies setting skipTaskbar: true. On Linux setting focusable: false makes the window stop interacting with wm, so the window will always stay on top in all workspaces.
    ?alwaysOnTop : bool - Whether the window should always stay on top of other windows. Default is false.
    ?fullscreen : bool - Whether the window should show in fullscreen. When explicitly set to false the fullscreen button will be hidden or disabled on macOS. Default is false.
    ?fullscreenable : bool - Whether the window can be put into fullscreen mode. On macOS, also whether the maximize/zoom button should toggle full screen mode or maximize window. Default is true.
    ?simpleFullscreen : bool - ⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Use pre-Lion fullscreen on macOS. Default is false.
    ?skipTaskbar : bool - ⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ || Whether to show the window in taskbar. Default is false.
    ?hiddenInMissionControl : bool - ⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Whether window should be hidden when the user toggles into mission control.
    ?kiosk : bool - Whether the window is in kiosk mode. Default is false.
    ?title : string - Default window title. Default is "Electron". If the HTML tag <title> is defined in the HTML file loaded by loadURL(), this property will be ignored.
    ?icon : U2<NativeImage, string> - The window icon. On Windows it is recommended to use ICO icons to get best visual effects, you can also leave it undefined so the executable's icon will be used.
    ?show : bool - Whether window should be shown when created. Default is true.
    ?frame : bool - Specify false to create a frameless window. Default is true.
    ?parent : BaseWindow - Specify parent window. Default is null.
    ?modal : bool - Whether this is a modal window. This only works when the window is a child window. Default is false.
    ?acceptFirstMouse : bool - ⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Whether clicking an inactive window will also click through to the web contents. Default is false on macOS. This option is not configurable on other platforms.
    ?disableAutoHideCursor : bool - Whether to hide cursor when typing. Default is false.
    ?autoHideMenuBar : bool - ⚠ OS Compatibility: WIN ✔ | MAC ❌ | LIN ✔ | MAS ❌ || Auto hide the menu bar unless the Alt key is pressed. Default is false.
    ?enableLargerThanScreen : bool - ⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Enable the window to be resized larger than screen. Only relevant for macOS, as other OSes allow larger-than-screen windows by default. Default is false.
    ?backgroundColor : string - The window's background color in Hex, RGB, RGBA, HSL, HSLA or named CSS color format. Alpha in #AARRGGBB format is supported if transparent is set to true. Default is #FFF (white). See win.setBackgroundColor for more information.
    ?hasShadow : bool - Whether window should have a shadow. Default is true.
    ?opacity : float - ⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ || Set the initial opacity of the window, between 0.0 (fully transparent) and 1.0 (fully opaque). This is only implemented on Windows and macOS.
    ?darkTheme : bool - Forces using dark theme for the window, only works on some GTK+3 desktop environments. Default is false.
    ?transparent : bool - Makes the window transparent. Default is false. On Windows, does not work unless the window is frameless.
    ?type : string - The type of window, default is normal window. See more about this below.
    ?visualEffectState : VisualEffectState - ⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Specify how the material appearance should reflect window activity state on macOS. Must be used with the vibrancy property. Possible values are:
    ?titleBarStyle : TitleBarStyle - The style of window title bar. Default is default. Possible values are:
    ?titleBarOverlay : U2<TitleBarOverlay, bool> - When using a frameless window in conjunction with win.setWindowButtonVisibility(true) on macOS or using a titleBarStyle so that the standard window controls ("traffic lights" on macOS) are visible, this property enables the Window Controls Overlay JavaScript APIs and CSS Environment Variables. Specifying true will result in an overlay with default system colors. Default is false.
    ?accentColor : U2<bool, string> - ⚠ OS Compatibility: WIN ✔ | MAC ❌ | LIN ❌ | MAS ❌ || The accent color for the window. By default, follows user preference in System Settings. Set to false to explicitly disable, or set the color in Hex, RGB, RGBA, HSL, HSLA or named CSS color format. Alpha values will be ignored.
    ?trafficLightPosition : Point - ⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Set a custom position for the traffic light buttons in frameless windows.
    ?roundedCorners : bool - ⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ || Whether frameless window should have rounded corners. Default is true. Setting this property to false will prevent the window from being fullscreenable on macOS. On Windows versions older than Windows 11 Build 22000 this property has no effect, and frameless windows will not have rounded corners.
    ?thickFrame : bool - ⚠ OS Compatibility: WIN ✔ | MAC ❌ | LIN ❌ | MAS ❌ || Use WS_THICKFRAME style for frameless windows on Windows, which adds the standard window frame. Setting it to false will remove window shadow and window animations, and disable window resizing via dragging the window edges. Default is true.
    ?vibrancy : Vibrancy - ⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Add a type of vibrancy effect to the window, only on macOS. Can be appearance-based, titlebar, selection, menu, popover, sidebar, header, sheet, window, hud, fullscreen-ui, tooltip, content, under-window, or under-page.
    ?backgroundMaterial : BackgroundMaterial - ⚠ OS Compatibility: WIN ✔ | MAC ❌ | LIN ❌ | MAS ❌ || Set the window's system-drawn background material, including behind the non-client area. Can be auto, none, mica, acrylic or tabbed. See win.setBackgroundMaterial for more information.
    ?zoomToPageWidth : bool - ⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Controls the behavior on macOS when option-clicking the green stoplight button on the toolbar or by clicking the Window > Zoom menu item. If true, the window will grow to the preferred width of the web page when zoomed, false will cause it to zoom to the width of the screen. This will also affect the behavior when calling maximize() directly. Default is false.
    ?tabbingIdentifier : string - ⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Tab group name, allows opening the window as a native tab. Windows with the same tabbing identifier will be grouped together. This also adds a native new tab button to your window's tab bar and allows your app and window to receive the new-window-for-tab event.

Returns: BrowserWindowConstructorOptions
?webPreferences : WebPreferences

Settings of web page's features.

?paintWhenInitiallyHidden : bool

Whether the renderer should be active when show is false and it has just been created. In order for document.visibilityState to work correctly on first load with show: false you should set this to false. Setting this to false will cause the ready-to-show event to not fire. Default is true.

?width : int

Window's width in pixels. Default is 800.

?height : int

Window's height in pixels. Default is 600.

?x : int

(**required** if y is used) Window's left offset from screen. Default is to center the window.

?y : int

(**required** if x is used) Window's top offset from screen. Default is to center the window.

?useContentSize : bool

The width and height would be used as web page's size, which means the actual window's size will include window frame's size and be slightly larger. Default is false.

?center : bool

Show window in the center of the screen. Default is false.

?minWidth : int

Window's minimum width. Default is 0.

?minHeight : int

Window's minimum height. Default is 0.

?maxWidth : int

Window's maximum width. Default is no limit.

?maxHeight : int

Window's maximum height. Default is no limit.

?resizable : bool

Whether window is resizable. Default is true.

?movable : bool

⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ || Whether window is movable. This is not implemented on Linux. Default is true.

?minimizable : bool

⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ || Whether window is minimizable. This is not implemented on Linux. Default is true.

?maximizable : bool

⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ || Whether window is maximizable. This is not implemented on Linux. Default is true.

?closable : bool

⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ || Whether window is closable. This is not implemented on Linux. Default is true.

?focusable : bool

Whether the window can be focused. Default is true. On Windows setting focusable: false also implies setting skipTaskbar: true. On Linux setting focusable: false makes the window stop interacting with wm, so the window will always stay on top in all workspaces.

?alwaysOnTop : bool

Whether the window should always stay on top of other windows. Default is false.

?fullscreen : bool

Whether the window should show in fullscreen. When explicitly set to false the fullscreen button will be hidden or disabled on macOS. Default is false.

?fullscreenable : bool

Whether the window can be put into fullscreen mode. On macOS, also whether the maximize/zoom button should toggle full screen mode or maximize window. Default is true.

?simpleFullscreen : bool

⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Use pre-Lion fullscreen on macOS. Default is false.

?skipTaskbar : bool

⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ || Whether to show the window in taskbar. Default is false.

?hiddenInMissionControl : bool

⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Whether window should be hidden when the user toggles into mission control.

?kiosk : bool

Whether the window is in kiosk mode. Default is false.

?title : string

Default window title. Default is "Electron". If the HTML tag <title> is defined in the HTML file loaded by loadURL(), this property will be ignored.

?icon : U2<NativeImage, string>

The window icon. On Windows it is recommended to use ICO icons to get best visual effects, you can also leave it undefined so the executable's icon will be used.

?show : bool

Whether window should be shown when created. Default is true.

?frame : bool

Specify false to create a frameless window. Default is true.

?parent : BaseWindow

Specify parent window. Default is null.

?modal : bool

Whether this is a modal window. This only works when the window is a child window. Default is false.

?acceptFirstMouse : bool

⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Whether clicking an inactive window will also click through to the web contents. Default is false on macOS. This option is not configurable on other platforms.

?disableAutoHideCursor : bool

Whether to hide cursor when typing. Default is false.

?autoHideMenuBar : bool

⚠ OS Compatibility: WIN ✔ | MAC ❌ | LIN ✔ | MAS ❌ || Auto hide the menu bar unless the Alt key is pressed. Default is false.

?enableLargerThanScreen : bool

⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Enable the window to be resized larger than screen. Only relevant for macOS, as other OSes allow larger-than-screen windows by default. Default is false.

?backgroundColor : string

The window's background color in Hex, RGB, RGBA, HSL, HSLA or named CSS color format. Alpha in #AARRGGBB format is supported if transparent is set to true. Default is #FFF (white). See win.setBackgroundColor for more information.

?hasShadow : bool

Whether window should have a shadow. Default is true.

?opacity : float

⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ || Set the initial opacity of the window, between 0.0 (fully transparent) and 1.0 (fully opaque). This is only implemented on Windows and macOS.

?darkTheme : bool

Forces using dark theme for the window, only works on some GTK+3 desktop environments. Default is false.

?transparent : bool

Makes the window transparent. Default is false. On Windows, does not work unless the window is frameless.

?type : string

The type of window, default is normal window. See more about this below.

?visualEffectState : VisualEffectState

⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Specify how the material appearance should reflect window activity state on macOS. Must be used with the vibrancy property. Possible values are:

?titleBarStyle : TitleBarStyle

The style of window title bar. Default is default. Possible values are:

?titleBarOverlay : U2<TitleBarOverlay, bool>

When using a frameless window in conjunction with win.setWindowButtonVisibility(true) on macOS or using a titleBarStyle so that the standard window controls ("traffic lights" on macOS) are visible, this property enables the Window Controls Overlay JavaScript APIs and CSS Environment Variables. Specifying true will result in an overlay with default system colors. Default is false.

?accentColor : U2<bool, string>

⚠ OS Compatibility: WIN ✔ | MAC ❌ | LIN ❌ | MAS ❌ || The accent color for the window. By default, follows user preference in System Settings. Set to false to explicitly disable, or set the color in Hex, RGB, RGBA, HSL, HSLA or named CSS color format. Alpha values will be ignored.

?trafficLightPosition : Point

⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Set a custom position for the traffic light buttons in frameless windows.

?roundedCorners : bool

⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ || Whether frameless window should have rounded corners. Default is true. Setting this property to false will prevent the window from being fullscreenable on macOS. On Windows versions older than Windows 11 Build 22000 this property has no effect, and frameless windows will not have rounded corners.

?thickFrame : bool

⚠ OS Compatibility: WIN ✔ | MAC ❌ | LIN ❌ | MAS ❌ || Use WS_THICKFRAME style for frameless windows on Windows, which adds the standard window frame. Setting it to false will remove window shadow and window animations, and disable window resizing via dragging the window edges. Default is true.

?vibrancy : Vibrancy

⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Add a type of vibrancy effect to the window, only on macOS. Can be appearance-based, titlebar, selection, menu, popover, sidebar, header, sheet, window, hud, fullscreen-ui, tooltip, content, under-window, or under-page.

?backgroundMaterial : BackgroundMaterial

⚠ OS Compatibility: WIN ✔ | MAC ❌ | LIN ❌ | MAS ❌ || Set the window's system-drawn background material, including behind the non-client area. Can be auto, none, mica, acrylic or tabbed. See win.setBackgroundMaterial for more information.

?zoomToPageWidth : bool

⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Controls the behavior on macOS when option-clicking the green stoplight button on the toolbar or by clicking the Window > Zoom menu item. If true, the window will grow to the preferred width of the web page when zoomed, false will cause it to zoom to the width of the screen. This will also affect the behavior when calling maximize() directly. Default is false.

?tabbingIdentifier : string

⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ || Tab group name, allows opening the window as a native tab. Windows with the same tabbing identifier will be grouped together. This also adds a native new tab button to your window's tab bar and allows your app and window to receive the new-window-for-tab event.

Returns: BrowserWindowConstructorOptions

Instance members

Instance member Description

this.accentColor

Full Usage: this.accentColor

⚠ OS Compatibility: WIN ✔ | MAC ❌ | LIN ❌ | MAS ❌ The accent color for the window. By default, follows user preference in System Settings. Set to false to explicitly disable, or set the color in Hex, RGB, RGBA, HSL, HSLA or named CSS color format. Alpha values will be ignored.

this.acceptFirstMouse

Full Usage: this.acceptFirstMouse

⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ Whether clicking an inactive window will also click through to the web contents. Default is false on macOS. This option is not configurable on other platforms.

this.alwaysOnTop

Full Usage: this.alwaysOnTop

Whether the window should always stay on top of other windows. Default is false.

this.autoHideMenuBar

Full Usage: this.autoHideMenuBar

⚠ OS Compatibility: WIN ✔ | MAC ❌ | LIN ✔ | MAS ❌ Auto hide the menu bar unless the Alt key is pressed. Default is false.

this.backgroundColor

Full Usage: this.backgroundColor

The window's background color in Hex, RGB, RGBA, HSL, HSLA or named CSS color format. Alpha in #AARRGGBB format is supported if transparent is set to true. Default is #FFF (white). See win.setBackgroundColor for more information.

this.backgroundMaterial

Full Usage: this.backgroundMaterial

⚠ OS Compatibility: WIN ✔ | MAC ❌ | LIN ❌ | MAS ❌ Set the window's system-drawn background material, including behind the non-client area. Can be auto, none, mica, acrylic or tabbed. See win.setBackgroundMaterial for more information.

this.center

Full Usage: this.center

Show window in the center of the screen. Default is false.

this.closable

Full Usage: this.closable

⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ Whether window is closable. This is not implemented on Linux. Default is true.

this.darkTheme

Full Usage: this.darkTheme

Forces using dark theme for the window, only works on some GTK+3 desktop environments. Default is false.

this.disableAutoHideCursor

Full Usage: this.disableAutoHideCursor

Whether to hide cursor when typing. Default is false.

this.enableLargerThanScreen

Full Usage: this.enableLargerThanScreen

⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ Enable the window to be resized larger than screen. Only relevant for macOS, as other OSes allow larger-than-screen windows by default. Default is false.

this.focusable

Full Usage: this.focusable

Whether the window can be focused. Default is true. On Windows setting focusable: false also implies setting skipTaskbar: true. On Linux setting focusable: false makes the window stop interacting with wm, so the window will always stay on top in all workspaces.

this.frame

Full Usage: this.frame

Specify false to create a frameless window. Default is true.

this.fullscreen

Full Usage: this.fullscreen

Whether the window should show in fullscreen. When explicitly set to false the fullscreen button will be hidden or disabled on macOS. Default is false.

this.fullscreenable

Full Usage: this.fullscreenable

Whether the window can be put into fullscreen mode. On macOS, also whether the maximize/zoom button should toggle full screen mode or maximize window. Default is true.

this.hasShadow

Full Usage: this.hasShadow

Whether window should have a shadow. Default is true.

this.height

Full Usage: this.height

Window's height in pixels. Default is 600.

this.hiddenInMissionControl

Full Usage: this.hiddenInMissionControl

⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ Whether window should be hidden when the user toggles into mission control.

this.icon

Full Usage: this.icon

The window icon. On Windows it is recommended to use ICO icons to get best visual effects, you can also leave it undefined so the executable's icon will be used.

this.kiosk

Full Usage: this.kiosk

Whether the window is in kiosk mode. Default is false.

this.maxHeight

Full Usage: this.maxHeight

Window's maximum height. Default is no limit.

this.maxWidth

Full Usage: this.maxWidth

Window's maximum width. Default is no limit.

this.maximizable

Full Usage: this.maximizable

⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ Whether window is maximizable. This is not implemented on Linux. Default is true.

this.minHeight

Full Usage: this.minHeight

Window's minimum height. Default is 0.

this.minWidth

Full Usage: this.minWidth

Window's minimum width. Default is 0.

this.minimizable

Full Usage: this.minimizable

⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ Whether window is minimizable. This is not implemented on Linux. Default is true.

this.modal

Full Usage: this.modal

Whether this is a modal window. This only works when the window is a child window. Default is false.

this.movable

Full Usage: this.movable

⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ Whether window is movable. This is not implemented on Linux. Default is true.

this.opacity

Full Usage: this.opacity

⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ Set the initial opacity of the window, between 0.0 (fully transparent) and 1.0 (fully opaque). This is only implemented on Windows and macOS.

this.paintWhenInitiallyHidden

Full Usage: this.paintWhenInitiallyHidden

Whether the renderer should be active when show is false and it has just been created. In order for document.visibilityState to work correctly on first load with show: false you should set this to false. Setting this to false will cause the ready-to-show event to not fire. Default is true.

this.parent

Full Usage: this.parent

Specify parent window. Default is null.

this.resizable

Full Usage: this.resizable

Whether window is resizable. Default is true.

this.roundedCorners

Full Usage: this.roundedCorners

⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ Whether frameless window should have rounded corners. Default is true. Setting this property to false will prevent the window from being fullscreenable on macOS. On Windows versions older than Windows 11 Build 22000 this property has no effect, and frameless windows will not have rounded corners.

this.show

Full Usage: this.show

Whether window should be shown when created. Default is true.

this.simpleFullscreen

Full Usage: this.simpleFullscreen

⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ Use pre-Lion fullscreen on macOS. Default is false.

this.skipTaskbar

Full Usage: this.skipTaskbar

⚠ OS Compatibility: WIN ✔ | MAC ✔ | LIN ❌ | MAS ❌ Whether to show the window in taskbar. Default is false.

this.tabbingIdentifier

Full Usage: this.tabbingIdentifier

⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ Tab group name, allows opening the window as a native tab. Windows with the same tabbing identifier will be grouped together. This also adds a native new tab button to your window's tab bar and allows your app and window to receive the new-window-for-tab event.

this.thickFrame

Full Usage: this.thickFrame

⚠ OS Compatibility: WIN ✔ | MAC ❌ | LIN ❌ | MAS ❌ Use WS_THICKFRAME style for frameless windows on Windows, which adds the standard window frame. Setting it to false will remove window shadow and window animations, and disable window resizing via dragging the window edges. Default is true.

this.title

Full Usage: this.title

Default window title. Default is "Electron". If the HTML tag is defined in the HTML file loaded by loadURL(), this property will be ignored.</p> </p> </div> <div class="icon-button-row"> <div class="fsdocs-source-link" title="Copy signature (XML)" onclick="Clipboard_CopyTo('<see cref=\'P:Fable.Electron.Types.BrowserWindowConstructorOptions.title\'/>')"> <iconify-icon icon="bi:filetype-xml" height="24" width="24"></iconify-icon> </div> <div class="fsdocs-source-link" title="Copy signature (Markdown)" onclick="Clipboard_CopyTo('`cref:P:Fable.Electron.Types.BrowserWindowConstructorOptions.title`')"> <iconify-icon icon="bi:filetype-md" height="24" width="24"></iconify-icon> </div> </div> </div> </td> </tr> <tr> <td class="fsdocs-member-usage"> <div> <code onmouseout="hideTip(event, '7219', 7219)" onmouseover="showTip(event, '7219', 7219)"> <p> <a id="titleBarOverlay"> <a href="#titleBarOverlay"> <code><span>this.titleBarOverlay </span></code> </a> </a> </p> </code> <div class="fsdocs-tip" id="7219"> <div class="member-tooltip"> Full Usage: <code><span>this.titleBarOverlay </span></code> <br/> <br/> </div> </div> </div> </td> <td class="fsdocs-member-xmldoc"> <div class="fsdocs-summary"> <div class="fsdocs-summary-contents"> <p class="fsdocs-summary"> <p>When using a frameless window in conjunction with win.setWindowButtonVisibility(true) on macOS or using a titleBarStyle so that the standard window controls ("traffic lights" on macOS) are visible, this property enables the Window Controls Overlay JavaScript APIs and CSS Environment Variables. Specifying true will result in an overlay with default system colors. Default is false.</p> </p> </div> <div class="icon-button-row"> <div class="fsdocs-source-link" title="Copy signature (XML)" onclick="Clipboard_CopyTo('<see cref=\'P:Fable.Electron.Types.BrowserWindowConstructorOptions.titleBarOverlay\'/>')"> <iconify-icon icon="bi:filetype-xml" height="24" width="24"></iconify-icon> </div> <div class="fsdocs-source-link" title="Copy signature (Markdown)" onclick="Clipboard_CopyTo('`cref:P:Fable.Electron.Types.BrowserWindowConstructorOptions.titleBarOverlay`')"> <iconify-icon icon="bi:filetype-md" height="24" width="24"></iconify-icon> </div> </div> </div> </td> </tr> <tr> <td class="fsdocs-member-usage"> <div> <code onmouseout="hideTip(event, '7220', 7220)" onmouseover="showTip(event, '7220', 7220)"> <p> <a id="titleBarStyle"> <a href="#titleBarStyle"> <code><span>this.titleBarStyle </span></code> </a> </a> </p> </code> <div class="fsdocs-tip" id="7220"> <div class="member-tooltip"> Full Usage: <code><span>this.titleBarStyle </span></code> <br/> <br/> </div> </div> </div> </td> <td class="fsdocs-member-xmldoc"> <div class="fsdocs-summary"> <div class="fsdocs-summary-contents"> <p class="fsdocs-summary"> <p>The style of window title bar. Default is default. Possible values are:</p> </p> </div> <div class="icon-button-row"> <div class="fsdocs-source-link" title="Copy signature (XML)" onclick="Clipboard_CopyTo('<see cref=\'P:Fable.Electron.Types.BrowserWindowConstructorOptions.titleBarStyle\'/>')"> <iconify-icon icon="bi:filetype-xml" height="24" width="24"></iconify-icon> </div> <div class="fsdocs-source-link" title="Copy signature (Markdown)" onclick="Clipboard_CopyTo('`cref:P:Fable.Electron.Types.BrowserWindowConstructorOptions.titleBarStyle`')"> <iconify-icon icon="bi:filetype-md" height="24" width="24"></iconify-icon> </div> </div> </div> </td> </tr> <tr> <td class="fsdocs-member-usage"> <div> <code onmouseout="hideTip(event, '7221', 7221)" onmouseover="showTip(event, '7221', 7221)"> <p> <a id="trafficLightPosition"> <a href="#trafficLightPosition"> <code><span>this.trafficLightPosition </span></code> </a> </a> </p> </code> <div class="fsdocs-tip" id="7221"> <div class="member-tooltip"> Full Usage: <code><span>this.trafficLightPosition </span></code> <br/> <br/> </div> </div> </div> </td> <td class="fsdocs-member-xmldoc"> <div class="fsdocs-summary"> <div class="fsdocs-summary-contents"> <p class="fsdocs-summary"> <p>⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ Set a custom position for the traffic light buttons in frameless windows.</p> </p> </div> <div class="icon-button-row"> <div class="fsdocs-source-link" title="Copy signature (XML)" onclick="Clipboard_CopyTo('<see cref=\'P:Fable.Electron.Types.BrowserWindowConstructorOptions.trafficLightPosition\'/>')"> <iconify-icon icon="bi:filetype-xml" height="24" width="24"></iconify-icon> </div> <div class="fsdocs-source-link" title="Copy signature (Markdown)" onclick="Clipboard_CopyTo('`cref:P:Fable.Electron.Types.BrowserWindowConstructorOptions.trafficLightPosition`')"> <iconify-icon icon="bi:filetype-md" height="24" width="24"></iconify-icon> </div> </div> </div> </td> </tr> <tr> <td class="fsdocs-member-usage"> <div> <code onmouseout="hideTip(event, '7222', 7222)" onmouseover="showTip(event, '7222', 7222)"> <p> <a id="transparent"> <a href="#transparent"> <code><span>this.transparent </span></code> </a> </a> </p> </code> <div class="fsdocs-tip" id="7222"> <div class="member-tooltip"> Full Usage: <code><span>this.transparent </span></code> <br/> <br/> </div> </div> </div> </td> <td class="fsdocs-member-xmldoc"> <div class="fsdocs-summary"> <div class="fsdocs-summary-contents"> <p class="fsdocs-summary"> <p>Makes the window transparent. Default is false. On Windows, does not work unless the window is frameless.</p> </p> </div> <div class="icon-button-row"> <div class="fsdocs-source-link" title="Copy signature (XML)" onclick="Clipboard_CopyTo('<see cref=\'P:Fable.Electron.Types.BrowserWindowConstructorOptions.transparent\'/>')"> <iconify-icon icon="bi:filetype-xml" height="24" width="24"></iconify-icon> </div> <div class="fsdocs-source-link" title="Copy signature (Markdown)" onclick="Clipboard_CopyTo('`cref:P:Fable.Electron.Types.BrowserWindowConstructorOptions.transparent`')"> <iconify-icon icon="bi:filetype-md" height="24" width="24"></iconify-icon> </div> </div> </div> </td> </tr> <tr> <td class="fsdocs-member-usage"> <div> <code onmouseout="hideTip(event, '7223', 7223)" onmouseover="showTip(event, '7223', 7223)"> <p> <a id="type"> <a href="#type"> <code><span>this.type </span></code> </a> </a> </p> </code> <div class="fsdocs-tip" id="7223"> <div class="member-tooltip"> Full Usage: <code><span>this.type </span></code> <br/> <br/> </div> </div> </div> </td> <td class="fsdocs-member-xmldoc"> <div class="fsdocs-summary"> <div class="fsdocs-summary-contents"> <p class="fsdocs-summary"> <p>The type of window, default is normal window. See more about this below.</p> </p> </div> <div class="icon-button-row"> <div class="fsdocs-source-link" title="Copy signature (XML)" onclick="Clipboard_CopyTo('<see cref=\'P:Fable.Electron.Types.BrowserWindowConstructorOptions.type\'/>')"> <iconify-icon icon="bi:filetype-xml" height="24" width="24"></iconify-icon> </div> <div class="fsdocs-source-link" title="Copy signature (Markdown)" onclick="Clipboard_CopyTo('`cref:P:Fable.Electron.Types.BrowserWindowConstructorOptions.type`')"> <iconify-icon icon="bi:filetype-md" height="24" width="24"></iconify-icon> </div> </div> </div> </td> </tr> <tr> <td class="fsdocs-member-usage"> <div> <code onmouseout="hideTip(event, '7224', 7224)" onmouseover="showTip(event, '7224', 7224)"> <p> <a id="useContentSize"> <a href="#useContentSize"> <code><span>this.useContentSize </span></code> </a> </a> </p> </code> <div class="fsdocs-tip" id="7224"> <div class="member-tooltip"> Full Usage: <code><span>this.useContentSize </span></code> <br/> <br/> </div> </div> </div> </td> <td class="fsdocs-member-xmldoc"> <div class="fsdocs-summary"> <div class="fsdocs-summary-contents"> <p class="fsdocs-summary"> <p>The width and height would be used as web page's size, which means the actual window's size will include window frame's size and be slightly larger. Default is false.</p> </p> </div> <div class="icon-button-row"> <div class="fsdocs-source-link" title="Copy signature (XML)" onclick="Clipboard_CopyTo('<see cref=\'P:Fable.Electron.Types.BrowserWindowConstructorOptions.useContentSize\'/>')"> <iconify-icon icon="bi:filetype-xml" height="24" width="24"></iconify-icon> </div> <div class="fsdocs-source-link" title="Copy signature (Markdown)" onclick="Clipboard_CopyTo('`cref:P:Fable.Electron.Types.BrowserWindowConstructorOptions.useContentSize`')"> <iconify-icon icon="bi:filetype-md" height="24" width="24"></iconify-icon> </div> </div> </div> </td> </tr> <tr> <td class="fsdocs-member-usage"> <div> <code onmouseout="hideTip(event, '7225', 7225)" onmouseover="showTip(event, '7225', 7225)"> <p> <a id="vibrancy"> <a href="#vibrancy"> <code><span>this.vibrancy </span></code> </a> </a> </p> </code> <div class="fsdocs-tip" id="7225"> <div class="member-tooltip"> Full Usage: <code><span>this.vibrancy </span></code> <br/> <br/> </div> </div> </div> </td> <td class="fsdocs-member-xmldoc"> <div class="fsdocs-summary"> <div class="fsdocs-summary-contents"> <p class="fsdocs-summary"> <p>⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ Add a type of vibrancy effect to the window, only on macOS. Can be appearance-based, titlebar, selection, menu, popover, sidebar, header, sheet, window, hud, fullscreen-ui, tooltip, content, under-window, or under-page.</p> </p> </div> <div class="icon-button-row"> <div class="fsdocs-source-link" title="Copy signature (XML)" onclick="Clipboard_CopyTo('<see cref=\'P:Fable.Electron.Types.BrowserWindowConstructorOptions.vibrancy\'/>')"> <iconify-icon icon="bi:filetype-xml" height="24" width="24"></iconify-icon> </div> <div class="fsdocs-source-link" title="Copy signature (Markdown)" onclick="Clipboard_CopyTo('`cref:P:Fable.Electron.Types.BrowserWindowConstructorOptions.vibrancy`')"> <iconify-icon icon="bi:filetype-md" height="24" width="24"></iconify-icon> </div> </div> </div> </td> </tr> <tr> <td class="fsdocs-member-usage"> <div> <code onmouseout="hideTip(event, '7226', 7226)" onmouseover="showTip(event, '7226', 7226)"> <p> <a id="visualEffectState"> <a href="#visualEffectState"> <code><span>this.visualEffectState </span></code> </a> </a> </p> </code> <div class="fsdocs-tip" id="7226"> <div class="member-tooltip"> Full Usage: <code><span>this.visualEffectState </span></code> <br/> <br/> </div> </div> </div> </td> <td class="fsdocs-member-xmldoc"> <div class="fsdocs-summary"> <div class="fsdocs-summary-contents"> <p class="fsdocs-summary"> <p>⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ Specify how the material appearance should reflect window activity state on macOS. Must be used with the vibrancy property. Possible values are:</p> </p> </div> <div class="icon-button-row"> <div class="fsdocs-source-link" title="Copy signature (XML)" onclick="Clipboard_CopyTo('<see cref=\'P:Fable.Electron.Types.BrowserWindowConstructorOptions.visualEffectState\'/>')"> <iconify-icon icon="bi:filetype-xml" height="24" width="24"></iconify-icon> </div> <div class="fsdocs-source-link" title="Copy signature (Markdown)" onclick="Clipboard_CopyTo('`cref:P:Fable.Electron.Types.BrowserWindowConstructorOptions.visualEffectState`')"> <iconify-icon icon="bi:filetype-md" height="24" width="24"></iconify-icon> </div> </div> </div> </td> </tr> <tr> <td class="fsdocs-member-usage"> <div> <code onmouseout="hideTip(event, '7227', 7227)" onmouseover="showTip(event, '7227', 7227)"> <p> <a id="webPreferences"> <a href="#webPreferences"> <code><span>this.webPreferences </span></code> </a> </a> </p> </code> <div class="fsdocs-tip" id="7227"> <div class="member-tooltip"> Full Usage: <code><span>this.webPreferences </span></code> <br/> <br/> </div> </div> </div> </td> <td class="fsdocs-member-xmldoc"> <div class="fsdocs-summary"> <div class="fsdocs-summary-contents"> <p class="fsdocs-summary"> <p>Settings of web page's features.</p> </p> </div> <div class="icon-button-row"> <div class="fsdocs-source-link" title="Copy signature (XML)" onclick="Clipboard_CopyTo('<see cref=\'P:Fable.Electron.Types.BrowserWindowConstructorOptions.webPreferences\'/>')"> <iconify-icon icon="bi:filetype-xml" height="24" width="24"></iconify-icon> </div> <div class="fsdocs-source-link" title="Copy signature (Markdown)" onclick="Clipboard_CopyTo('`cref:P:Fable.Electron.Types.BrowserWindowConstructorOptions.webPreferences`')"> <iconify-icon icon="bi:filetype-md" height="24" width="24"></iconify-icon> </div> </div> </div> </td> </tr> <tr> <td class="fsdocs-member-usage"> <div> <code onmouseout="hideTip(event, '7228', 7228)" onmouseover="showTip(event, '7228', 7228)"> <p> <a id="width"> <a href="#width"> <code><span>this.width </span></code> </a> </a> </p> </code> <div class="fsdocs-tip" id="7228"> <div class="member-tooltip"> Full Usage: <code><span>this.width </span></code> <br/> <br/> </div> </div> </div> </td> <td class="fsdocs-member-xmldoc"> <div class="fsdocs-summary"> <div class="fsdocs-summary-contents"> <p class="fsdocs-summary"> <p>Window's width in pixels. Default is 800.</p> </p> </div> <div class="icon-button-row"> <div class="fsdocs-source-link" title="Copy signature (XML)" onclick="Clipboard_CopyTo('<see cref=\'P:Fable.Electron.Types.BrowserWindowConstructorOptions.width\'/>')"> <iconify-icon icon="bi:filetype-xml" height="24" width="24"></iconify-icon> </div> <div class="fsdocs-source-link" title="Copy signature (Markdown)" onclick="Clipboard_CopyTo('`cref:P:Fable.Electron.Types.BrowserWindowConstructorOptions.width`')"> <iconify-icon icon="bi:filetype-md" height="24" width="24"></iconify-icon> </div> </div> </div> </td> </tr> <tr> <td class="fsdocs-member-usage"> <div> <code onmouseout="hideTip(event, '7229', 7229)" onmouseover="showTip(event, '7229', 7229)"> <p> <a id="x"> <a href="#x"> <code><span>this.x </span></code> </a> </a> </p> </code> <div class="fsdocs-tip" id="7229"> <div class="member-tooltip"> Full Usage: <code><span>this.x </span></code> <br/> <br/> </div> </div> </div> </td> <td class="fsdocs-member-xmldoc"> <div class="fsdocs-summary"> <div class="fsdocs-summary-contents"> <p class="fsdocs-summary"> <p>(<strong>required</strong> if y is used) Window's left offset from screen. Default is to center the window.</p> </p> </div> <div class="icon-button-row"> <div class="fsdocs-source-link" title="Copy signature (XML)" onclick="Clipboard_CopyTo('<see cref=\'P:Fable.Electron.Types.BrowserWindowConstructorOptions.x\'/>')"> <iconify-icon icon="bi:filetype-xml" height="24" width="24"></iconify-icon> </div> <div class="fsdocs-source-link" title="Copy signature (Markdown)" onclick="Clipboard_CopyTo('`cref:P:Fable.Electron.Types.BrowserWindowConstructorOptions.x`')"> <iconify-icon icon="bi:filetype-md" height="24" width="24"></iconify-icon> </div> </div> </div> </td> </tr> <tr> <td class="fsdocs-member-usage"> <div> <code onmouseout="hideTip(event, '7230', 7230)" onmouseover="showTip(event, '7230', 7230)"> <p> <a id="y"> <a href="#y"> <code><span>this.y </span></code> </a> </a> </p> </code> <div class="fsdocs-tip" id="7230"> <div class="member-tooltip"> Full Usage: <code><span>this.y </span></code> <br/> <br/> </div> </div> </div> </td> <td class="fsdocs-member-xmldoc"> <div class="fsdocs-summary"> <div class="fsdocs-summary-contents"> <p class="fsdocs-summary"> <p>(<strong>required</strong> if x is used) Window's top offset from screen. Default is to center the window.</p> </p> </div> <div class="icon-button-row"> <div class="fsdocs-source-link" title="Copy signature (XML)" onclick="Clipboard_CopyTo('<see cref=\'P:Fable.Electron.Types.BrowserWindowConstructorOptions.y\'/>')"> <iconify-icon icon="bi:filetype-xml" height="24" width="24"></iconify-icon> </div> <div class="fsdocs-source-link" title="Copy signature (Markdown)" onclick="Clipboard_CopyTo('`cref:P:Fable.Electron.Types.BrowserWindowConstructorOptions.y`')"> <iconify-icon icon="bi:filetype-md" height="24" width="24"></iconify-icon> </div> </div> </div> </td> </tr> <tr> <td class="fsdocs-member-usage"> <div> <code onmouseout="hideTip(event, '7231', 7231)" onmouseover="showTip(event, '7231', 7231)"> <p> <a id="zoomToPageWidth"> <a href="#zoomToPageWidth"> <code><span>this.zoomToPageWidth </span></code> </a> </a> </p> </code> <div class="fsdocs-tip" id="7231"> <div class="member-tooltip"> Full Usage: <code><span>this.zoomToPageWidth </span></code> <br/> <br/> </div> </div> </div> </td> <td class="fsdocs-member-xmldoc"> <div class="fsdocs-summary"> <div class="fsdocs-summary-contents"> <p class="fsdocs-summary"> <p>⚠ OS Compatibility: WIN ❌ | MAC ✔ | LIN ❌ | MAS ❌ Controls the behavior on macOS when option-clicking the green stoplight button on the toolbar or by clicking the Window > Zoom menu item. If true, the window will grow to the preferred width of the web page when zoomed, false will cause it to zoom to the width of the screen. This will also affect the behavior when calling maximize() directly. Default is false.</p> </p> </div> <div class="icon-button-row"> <div class="fsdocs-source-link" title="Copy signature (XML)" onclick="Clipboard_CopyTo('<see cref=\'P:Fable.Electron.Types.BrowserWindowConstructorOptions.zoomToPageWidth\'/>')"> <iconify-icon icon="bi:filetype-xml" height="24" width="24"></iconify-icon> </div> <div class="fsdocs-source-link" title="Copy signature (Markdown)" onclick="Clipboard_CopyTo('`cref:P:Fable.Electron.Types.BrowserWindowConstructorOptions.zoomToPageWidth`')"> <iconify-icon icon="bi:filetype-md" height="24" width="24"></iconify-icon> </div> </div> </div> </td> </tr> </tbody> </table> </div> <div></div> </div> </div> </main> <aside id="fsdocs-page-menu"> <p id="on-this-page">On this page</p> <div class="empty"></div> </aside> <dialog> <input type="search" placeholder="Search docs" /> <div class="results"> <ul></ul> <p class="empty">Type something to start searching.</p> </div> </dialog> <script type="module" src="/fable-electron-docs-api/content/fsdocs-tips.js"></script> <script type="module" src="/fable-electron-docs-api/content/fsdocs-theme-toggle.js"></script> <script type="module" src="/fable-electron-docs-api/content/fsdocs-details-toggle.js"></script> <script type="module" src="/fable-electron-docs-api/content/fsdocs-theme.js"></script> <script type="module" src="/fable-electron-docs-api/content/fsdocs-search.js"></script> </body> </html>