Stars API

Stars

Extends Effect.

Factory Function

createStars(config?: StarsConfig)

Methods

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

---

StarsConfig

interface StarsConfig {
    mode?: StarMode;
    starCount?: number;
    shootingInterval?: [number, number];
    shootingSpeed?: number;
    twinkleSpeed?: number;
    color?: string;
    shootingColor?: string;
    trailLength?: number;
    scale?: number;
}

Property	Type	Default	Description
mode	StarMode	'both'	Which layers to display.
starCount	number	150	Number of twinkling background stars. Automatically halved on small screens.
shootingInterval	[number, number]	[120, 360]	Tick range between shooting star spawns.
shootingSpeed	number	1	Shooting star speed multiplier.
twinkleSpeed	number	1	Twinkle animation speed multiplier.
color	string	'#ffffff'	Star color (hex string).
shootingColor	string	'#ffffff'	Shooting star color (hex string).
trailLength	number	15	Number of trail points per shooting star.
scale	number	1	Global scale factor.

---

StarMode

type StarMode = 'sky' | 'shooting' | 'both';

Mode	Description
sky	Only twinkling background stars.
shooting	Only shooting stars with trails.
both	Both twinkling stars and shooting stars.

---

Star

Internal representation of a background star.

type Star = {
    x: number;           // Normalized X position (0-1)
    y: number;           // Normalized Y position (0-1)
    size: number;        // Radius in pixels
    twinklePhase: number; // Phase offset for twinkle
    twinkleSpeed: number; // Individual twinkle speed
    brightness: number;   // Base brightness (0-1)
};

---

ShootingStar

Internal representation of a shooting star.

type ShootingStar = {
    x: number;    // X position in pixels
    y: number;    // Y position in pixels
    vx: number;   // Horizontal velocity
    vy: number;   // Vertical velocity
    alpha: number; // Current opacity
    size: number;  // Head radius
    decay: number; // Alpha decay per frame
    trail: { x: number; y: number }[]; // Trail positions
};