super-browser-window-kit/README.md

Super toolkit for enhanced Electron BrowserWindow with rounded corners and macOS liquid glass effects

[![en](https://img.shields.io/badge/lang-en-red.svg)](README.md)
[![ja](https://img.shields.io/badge/lang-ja-blue.svg)](README.ja.md)
[![ko](https://img.shields.io/badge/lang-ko-yellow.svg)](README.ko.md)
[![zh-cn](https://img.shields.io/badge/lang-zh--cn-green.svg)](README.zh.md)

# super-browser-window-kit

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

🏠 **Homepage**:
[https://bytemyth.com/super-browser-window-kit](https://bytemyth.com/super-browser-window-kit)

## Project Overview

Bring modern native macOS window visual effects to Electron applications.

## Screenshot

![Super Browser Window Kit Screenshot](https://raw.githubusercontent.com/gaodeng/super-browser-window-kit-example/main/docs/screenshot.png)

## Installation

```bash
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.

```js
import { app, BrowserWindow } from "electron";
import SuperBrowserWindowKit, {
  AutoresizingMask,
  GlassMaterialVariant,
} from "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: hi@bytemyth.com
 * ===========================================================
 */
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",
    show: false,
  });
  win.loadFile("index.html");
  SuperBrowserWindowKit.setLicense(LICENSE_CODE);
  SuperBrowserWindowKit.enableWindowCornerCustomization();
  SuperBrowserWindowKit.setWindowCornerRadius(win.getNativeWindowHandle(), 26);
  win.show();
});
```

## Main API

```ts
// 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 | { light: string; dark: string }): void;

// Glass view
addGlassEffectView(handle: Buffer, options?: GlassOptions): number;
setGlassCornerRadius(handle: Buffer, id: number, cornerRadius: number): void;
setGlassColor(handle: Buffer, id: number, color: string | { light: string; dark: string }): void;
setVariant(handle: Buffer, id: number, variant: GlassMaterialVariant): void;

// View common
removeView(handle: Buffer, id: number): boolean;
setAutoresizingMask(handle: Buffer, id: number, mask: AutoresizingMask | number): boolean;
getFrame(handle: Buffer, id: number): GlassFrame | null;
updateFrame(handle: Buffer, id: number, options: { x?: number; y?: number; width?: number; height?: number }): boolean;

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

## Example

- `dist-examples/main.js`: Window corner and SideBar layout example

## 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](https://bytemyth.com/super-browser-window-kit)
or contact hi@bytemyth.com with your company/team information to obtain a
commercial license.