super-browser-window-kit

super-browser-window-kit

High-fidelity macOS Tahoe toolkit, designed for Electron BrowserWindow.

🏠 Homepage: https://bytemyth.com/super-browser-window-kit

Project Overview

Bring modern native macOS window visual effects to Electron applications.

Screenshots

Window Rounded Corners & Sidebar

Experience seamless native macOS aesthetics with beautifully rounded window corners and sidebar integration.

Liquid Glass Effect

Harness the power of native NSGlassEffectView for authentic macOS liquid glass effects - no CSS hacks, just pure native performance.

Installation

npm install super-browser-window-kit

Quick Start

Rounded Corners for BrowserWindow

Easily enable beautiful, native-style rounded corners for your Electron BrowserWindow on macOS. This feature helps your app blend seamlessly with modern macOS aesthetics, providing a polished and professional look. Simply call the API after window creation to customize the corner radius as needed.

const { app, BrowserWindow } = require("electron");
const path = require("node:path");
const {
  default: SuperBrowserWindowKit,
  AutoresizingMask,
  GlassMaterialVariant,
  SystemColor,
} = require("super-browser-window-kit");

/**
 * =====================[ LICENSE NOTICE ]=====================
 * This license code is valid only for com.github.Electron test builds.
 * It will NOT work in production environments.
 * For production use, please obtain a valid commercial license.
 *
 * Official website: https://bytemyth.com/super-browser-window-kit
 * Contact: [e-mail]
 * ===========================================================
 */
const LICENSE_CODE =
  "GCAYQ-ASCAG-Q76KA-ELXLU-HN8CV-3ZK8P-STALL-QLSVZ-9FFSX-3S2ZU-4QVSC-LLJ7U-KH6K7-G88HA-4TTDJ-58G9H-GZFY6-DDSDJ-L5ZB9-V7UMB-896CS-P9AVC-GULAB-EEAGQ-T77DP-DRBJN-G829M-ZZF9M-L2VEN-RZM8F-SQ4KW-3JLLB-MUVXP-TS3P8-7ZFZM-4L2P3-S4TTA-Z7EVY-Z5H9J-FYDUS-WQCYW-C92PZ-BB23J-QZEVP-QNQ";
app.whenReady().then(() => {
  const win = new BrowserWindow({
    width: 1000,
    height: 700,
    titleBarStyle: "hiddenInset",
    trafficLightPosition: { x: 20, y: 20 },
    show: false,
  });
  win.loadFile("index.html");
  SuperBrowserWindowKit.setLicense(LICENSE_CODE);
  SuperBrowserWindowKit.enableWindowCornerCustomization();
  SuperBrowserWindowKit.setWindowCornerRadius(win.getNativeWindowHandle(), 26);
  win.show();
});

Main API

// Window corner
enableWindowCornerCustomization(): boolean;
setWindowCornerRadius(handle: Buffer, radius?: number): boolean;
disableWindowCornerCustomization(): boolean;

// Background view
addBackgroundView(handle: Buffer, options?: BackgroundOptions): number;
setBackgroundCornerRadius(handle: Buffer, id: number, cornerRadius: number): void;
setBackgroundColor(handle: Buffer, id: number, color: string | SystemColor | { light: string | SystemColor; dark: string | SystemColor }): void;

// Glass view
addGlassEffectView(handle: Buffer, options?: EffectViewOptions): number;
getEffectViewType(handle: Buffer, id: number): EffectViewType | -1;
setGlassCornerRadius(handle: Buffer, id: number, cornerRadius: number, masksToBounds?: boolean): void;
setGlassColor(handle: Buffer, id: number, color: string | SystemColor | { light: string | SystemColor; dark: string | SystemColor }): void;
setGlassVariant(handle: Buffer, id: number, variant: GlassMaterialVariant): void;

// View common
removeView(handle: Buffer, id: number): boolean;
setViewAutoresizingMask(handle: Buffer, id: number, mask: AutoresizingMask | number): boolean;
getViewFrame(handle: Buffer, id: number): ViewFrame | null;
setViewFrame(handle: Buffer, id: number, options: { x?: number; y?: number; width?: number; height?: number }): boolean;

// Window background
setWindowBackgroundColor(handle: Buffer, color: string | SystemColor | { light: string | SystemColor; dark: string | SystemColor }): void;

// Fullscreen notification
setFullScreenNotificationListener(handle: Buffer, callback: FullScreenNotificationCallback): boolean;
removeFullScreenNotificationListener(handle: Buffer): boolean;

// License
setLicense(license: string): boolean;
getBundleId(): string;

Example

For a complete working example, check out the demo repository: https://github.com/gaodeng/super-browser-window-kit-example

Or try it in Electron Fiddle: https://gist.github.com/gaodeng/4ca07e70b32701b99fbe0063efb9cdb9

Author

bytemyth team

License

Copyright (c) 2025 bytemyth team. All rights reserved.

This is proprietary software. You can use it for evaluation and testing purposes.

For commercial use in production environments, please visit https://bytemyth.com/super-browser-window-kit or contact [e-mail] with your company/team information to obtain a commercial license.