← All particles
Petal Drift
Petals fall and tumble edge-on, carried sideways by one shared current.
ambientcalmelegant26 particles · light · canvas-2d · automatic · looping
Variant
The canvas in this preview is the file shown here. The surrounding demo shell only provides context and is not part of the copied code.
217 lines · react only
import { useEffect, useRef } from "react";
/**
* Vibary · Petal Drift
*
* Petals fall, turn edge-on as they tumble, and drift sideways on a slow
* current. The illusion depends on two things a naive particle field
* misses: each petal spins about its own axis so it periodically showsAbout this effect
Ambient weather for a screen that should feel alive without asking for attention — an app-info page, a seasonal empty state, the background behind a welcome. Two details do the work: each petal spins about its own axis so it narrows to a line and nearly vanishes as it turns edge-on, and the sideways drift comes from a single low-frequency gust sampled per petal rather than independent randomness, so the field sways as a body instead of shimmering like static.
App info screenSeasonal empty stateWelcome backgroundCelebration backdrop