Novadesk Docs

Appearance

BlurBehind Addon ​

Apply Windows blur/acrylic background effects and rounded corner styles to a widget window handle.

What is BlurBehind? ​

The BlurBehind addon lets you make your NovaDesk widget windows look modern by adding:

  • Blur Behind — a standard translucent blur effect behind the window
  • Acrylic — a frosted-glass effect similar to Windows 11 settings panels
  • Rounded Corners — make window edges round, small-round, or sharp
  • Stroke — add a visible border around the window (Win11+)
  • Toggle — easily toggle effects on/off

These effects only work on Windows 10 (build 17763+) and Windows 11.

Getting Started ​

First, load the addon in your script:

javascript
import { addon } from "novadesk";

// Load the BlurBehind addon DLL
const blurBehind = addon.load("path/to/BlurBehind.dll");

TIP

Replace "path/to/BlurBehind.dll" with the actual path to the BlurBehind.dll file on your system.

Table of Contents ​

Quick Example ​

Here is a minimal example that applies an acrylic effect to a widget window:

javascript
import { addon, widgetWindow } from "novadesk";
const blurBehind = addon.load("path/to/BlurBehind.dll");

// Create a widget window
const win = new widgetWindow({ id: "demo", width: 400, height: 300, script: "ui.js" });

// Get the window handle (HWND) and apply the effect
const hwnd = win.getHandle();
blurBehind.apply(hwnd, "acrylic", "roundsmall");

How Window Handles (HWND) Work ​

Every window on Windows has a unique number called a handle (HWND). You need this handle to tell the addon which window to apply effects to.

You can get a window handle from:

  • widgetWindow.getHandle() — returns the HWND of your NovaDesk widget
  • A number — e.g. 12345
  • A hex string — e.g. "0x1A2B3C" or "0000000000290386"
blurBehind.apply(hwnd [, type, corner]) #
BlurBehind

Applies a blur or acrylic background effect to the target window and optionally sets its corner style. Throws if the window handle is invalid.

INFO

The function first clears any existing effect, then applies the new one. This ensures a clean state.

Effect types:

Value Description
blurbehind Standard blur-behind effect (default). Semi-transparent blur behind the window.
acrylic Acrylic/frosted-glass effect. More opaque and modern-looking.
none / disabled Removes any active effect.

Corner styles:

Value Description
default System default rounded corners.
round Rounded corners.
roundsmall Small rounded corners.
none Sharp corners (no rounding).

INFO

Corner styles depend on Windows version and compositor support. They require Windows 11 or later.

PARAMETERS

hwnd number | string
Target window handle. Supports numeric HWND, decimal string, or hex string (0x... format).
type string OPTIONAL
Effect type: blurbehind (default), acrylic, none, or disabled.
corner string OPTIONAL
Corner style: default (default), round, roundsmall, or none.
RETURNS: boolean true if the effect was applied successfully, false otherwise.
javascript
import { addon, widgetWindow } from "novadesk";
const blurBehind = addon.load("path/to/BlurBehind.dll");

const win = new widgetWindow({ id: "demo", width: 400, height: 300, script: "ui.js" });
const hwnd = win.getHandle();

// Acrylic + small rounded corners
blurBehind.apply(hwnd, "acrylic", "roundsmall");

// Standard blur, default corners
blurBehind.apply(hwnd, "blurbehind");

// Acrylic only (no corner change)
blurBehind.apply(hwnd, "acrylic");
blurBehind.disable(hwnd) #
BlurBehind

Removes any active blur or acrylic effect from the window. Equivalent to calling apply(hwnd, "none").

PARAMETERS

hwnd number | string
Target window handle.
RETURNS: boolean true if the effect was removed, false otherwise.
javascript
blurBehind.disable(hwnd);
blurBehind.setCorner(hwnd, corner) #
BlurBehind

Sets only the corner style of a window without changing the blur/acrylic state. This is useful when you want to adjust corners independently of the background effect.

PARAMETERS

hwnd number | string
Target window handle.
corner string
Corner style: default, round, roundsmall, or none.
RETURNS: boolean true on success, false otherwise.
javascript
// Change corners without touching the blur effect
blurBehind.setCorner(hwnd, "round");
blurBehind.setEffect(hwnd, effect) #
BlurBehind

Sets the visual effect of a window without changing the accent type. This allows you to control the effect independently.

PARAMETERS

hwnd number | string
Target window handle.
effect string
Effect type: default, none, or disabled.
RETURNS: boolean true on success, false otherwise.
javascript
// Change the effect style
blurBehind.setEffect(hwnd, "none");
blurBehind.setStroke(hwnd, color) #
BlurBehind

Sets the stroke/border style of a window. Requires Windows 11 or later.

PARAMETERS

hwnd number | string
Target window handle.
color string
Stroke style: visible, hidden, or a color string.
RETURNS: boolean true on success, false otherwise.
javascript
// Show a visible border
blurBehind.setStroke(hwnd, "visible");

// Hide the border
blurBehind.setStroke(hwnd, "hidden");
blurBehind.toggle(hwnd) #
BlurBehind

Toggles blur on/off for a window. Stores and restores the previous configuration per HWND.

PARAMETERS

hwnd number | string
Target window handle.
RETURNS: boolean true if blur is now ON, false if it was turned OFF.
javascript
// Toggle blur effect
const isOn = blurBehind.toggle(hwnd);
console.log("Blur is now", isOn ? "ON" : "OFF");
blurBehind.isSupported(feature) #
BlurBehind

Checks if a specific feature is supported on the current Windows version.

PARAMETERS

feature string
Feature to check: blur, blurbehind, acrylic, corner, stroke, or border.
RETURNS: boolean true if the feature is supported on this system, false otherwise.
javascript
if (blurBehind.isSupported("acrylic")) {
  console.log("Acrylic effects are available");
}

The addon also exposes a supports object with boolean properties for each feature:

Property Type Description
blur boolean true on Windows 10+
acrylic boolean true on Windows 11+
corner boolean true on Windows 11+
stroke boolean true on Windows 11+
javascript
const blurBehind = addon.load("path/to/BlurBehind.dll");
console.log("Acrylic supported:", blurBehind.supports.acrylic);
console.log("Stroke supported:", blurBehind.supports.stroke);

Full Example ​

Here is a complete example that creates a widget, applies effects, and demonstrates toggling:

javascript
import { addon, widgetWindow } from "novadesk";
const blurBehind = addon.load("path/to/BlurBehind.dll");

const win = new widgetWindow({ id: "blur-demo", width: 400, height: 300, script: "ui.js" });
const hwnd = win.getHandle();

// Apply acrylic with small rounded corners
blurBehind.apply(hwnd, "acrylic", "roundsmall");

// Later, switch to just blur effect
blurBehind.apply(hwnd, "blurbehind", "round");

// Change corners only
blurBehind.setCorner(hwnd, "roundsmall");

// Remove all effects
blurBehind.disable(hwnd);