Your system asks for reduced motion, so VFX-JS draws nothing. Demos on this site show plain HTML.

Type

PatternRefractionParams

import type { PatternRefractionParams } from "@vfx-js/effects";

Properties

angle: number

Pattern rotation, in degrees.

centerX: number

Pattern center X, in [0, 1].

centerY: number

Pattern center Y, in [0, 1].

dispersion: number

Chromatic dispersion (per-channel refraction offset), in [0, 1].

edgeWrap: RefractionEdgeWrap

Out-of-range edge sampling.

frost: number

Frosted-glass jitter, in [0, 1].

pattern: RefractionPattern

Refraction pattern.

smoothness: number

Smooth the displacement across pattern boundaries, in [0, 1].

strength: number

Refraction amount.

stripWidth: number

Width of one strip/cell, as a fraction of the element, in (0, 1].