Skip to content

Bubbles API

Bubbles

Extends Effect.

Factory Function

typescript
createBubbles(config?: BubblesConfig)

Methods

See Effect for the full method reference: mount(), start(), pause(), resume(), configure(), withFade(), and destroy().


BubblesConfig

typescript
interface BubblesConfig {
    count?: number;
    sizeRange?: [number, number];
    speed?: number;
    popOnClick?: boolean;
    popRadius?: number;
    colors?: string[];
    wobbleAmount?: number;
    scale?: number;
}
PropertyTypeDefaultDescription
countnumber30Number of bubbles. Automatically halved on small screens.
sizeRange[number, number][10, 40]Min/max bubble radius in pixels (before scale).
speednumber1Rise speed multiplier.
popOnClickbooleantrueEnable click-to-pop interaction.
popRadiusnumber50Click detection radius in pixels.
colorsstring[]['#88ccff', '#aaddff', '#ccbbff']Base colors for bubble hue.
wobbleAmountnumber1Horizontal wobble intensity multiplier.
scalenumber1Scales all bubble sizes proportionally.