Ripples
Water ripples on any image, video or CSS background, rendered with WebGL.
Click or drag across the water.
Weather
Snow, rain, fog, lightning, leaves and embers on one shared wind. Snow settles on the elements you choose and melts away when it stops.
Snow piles up on the rooftops. Move the pointer to push the wind around.
Fluid
A real fluid simulation on the GPU: a living background behind your content, or a smoke trail that follows the cursor.
Drag through it
It keeps flowing on its own. Your pointer stirs it.
Gravity
Elements come loose, fall and pile up. Grab them and throw them around, then fly everything back into place. It has its own small physics engine.
Gear for the long way round
Packs, shells and stoves tested on real trips, and repaired for free when they wear out.
Drop the page, then drag the pieces. Escape puts it all back.
Or type ↑ ↑ ↓ ↓ ← → ← → B A anywhere to drop this whole page.
Dissolve
Make any element crumble into dust, burn away, melt or fade, then bring it back the same way. The real element stays on the page the whole time; an SVG filter hides it piece by piece.
Click a card. It comes back on its own a moment later.
React
Components and hooks for every effect. They render on the server, start after mount, and update the running effect when options change.
Install the React package with the effects you use. Each effect has its own entry point.
npm install @elementalfx/react @elementalfx/dissolve