Skip to content

Petals API

Petals

Extends Effect.

Factory Function

typescript
createPetals(config?: PetalsConfig)

Methods

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


PetalsConfig

typescript
interface PetalsConfig {
    count?: number;
    colors?: string[];
    size?: number;
    speed?: number;
    wind?: number;
    scale?: number;
}
PropertyTypeDefaultDescription
countnumber100Number of petals. Automatically halved on small screens.
colorsstring[]Sakura palette (7 pinks)Array of CSS color strings for petal colors.
sizenumber24Maximum petal size in pixels (before scale).
speednumber0.7Fall speed multiplier.
windnumber0.15Horizontal wind strength. Positive = right, negative = left.
scalenumber1Scales all petal sizes proportionally.

Petal

Internal representation of a petal particle.

typescript
type Petal = {
    x: number;          // Normalized X position (0-1)
    y: number;          // Normalized Y position (0-1)
    size: number;       // Petal size in pixels
    depth: number;      // Depth layer (0.3-1) for parallax
    rotation: number;   // Current rotation angle
    flipAngle: number;  // 3D flip angle for tumbling
    colorIndex: number; // Index into sprite array
};