Skip to content

Snow Globe

A glass snow globe on a wooden pedestal: shaken once, the snow swirls and settles round a tiny winter scene. Loops perfectly.

3D object, V2 Objects3DSeamless loop, verified608 lines of codev1.0.0

In Light, glass & shine, Nature & weather, Craft & heritage

Next: Clockwork ButterflySurprise me

Snow Globe preview
Starting live preview…
00:00:00:00 / 00:00:00:01

Live, running the real source at reduced resolution.

Open in the title maker

Your current settings go with it. Combine several clips and hand them over together from your sequence.

Effect controls

Presets

The words engraved on the brass plaque.

1
1
3

Changes the flakes, the wood grain and the lights behind.

The preview runs the same code your AI receives. These settings travel with the hand-off.

Info

What it is

A snow globe on a turned wooden pedestal, in a dark, cosy room whose lights show upside down in the glass. Inside, a tiny winter scene under a sphere of liquid glass: a log cabin with glowing windows, a decorated Christmas tree with presents, or a snowman by a lamp post. The globe is picked up and shaken once: the flakes lift, swirl and drift back down onto the snow, and by the end of the loop it is at rest again. Or leave it still and let the snow fall gently for ever. A brass plaque on the front carries your own words. Choose the scene, the wood, the colour of the liquid, the amount of snow and how hard it is shaken, and the room's lights: golden, Christmas or cool.

Reuse it in your own idea

  • Holiday greeting: Christmas tree with your family name or a wish on the plaque, Christmas lights.
  • Seasonal promotion: Cabin in a blizzard behind your offer.
  • Looping background: Snowman, gentle snowfall, camera drift on, behind a quote.

Which part is reusable

src/snow-globe.js is the ingredient your AI reuses. demo.js is only the example scene around it, and uses chrome-material only for the demo.

Good to know

  • The flakes are simple opaque points, not snowflakes: they are tiny at normal size.
  • The shake is choreographed, not simulated: flakes never collide with the scene.

Technical details

Technical details
Implementation
Three.js 0.185.1 (WebGL) · ES module src/snow-globe.js
Exports
  • createSnowGlobe({ scene?, base?, plaque?, snow?, tint?, seed?, anisotropy? }) => { group, sphere, height, lift(progress), update(time, loopSeconds, { mode?, shake? }), dispose() }
  • createBokehBackdrop(theme?, seed?) => { mesh, dispose() }
  • BASES: { walnut, mahogany, ebony }
  • SCENES: ['cabin', 'tree', 'snowman']
Dependencies (exact)
  • three@0.185.1 (source) — Renderer, geometry and physical glass (transmission).
  • chrome-material@1.1.0 (demo) — Studio environment light and the contact shadow.
  • apw-runtime@1.0.0 (demo) — Demo harness.
How it fits a scene

Coordinates: 1 unit = 10 cm. The globe's sphere has a radius of 2.05 and is centred 2.73 above the table; the pedestal is 4 across.

Lighting: Physical glass and brass: needs scene.environment. The tiny scene carries its own warm lights. The glass refracts opaque meshes only, so a backdrop (createBokehBackdrop) must be opaque to show through it.

Timing: update(time, loopSeconds) is a pure function of time; frames render in any order. lift(progress) gives the shake's lift for a contact shadow.

Output
1080×1080, 30 fps, 12 s · procedural (computed from the frame number) · seamless loop — Shaken: the snow starts and ends at rest on the ground and the shake is zero before and after it. Snowfall: every flake falls through the globe a whole number of times and sways in whole cycles. Either way the last frame meets the first.
Tested
Rendered 360 frames on 2026-10-06 in Chrome 154.0.8037.97 headless on Linux 7.0.0-38-generic (x64), Node 22.14.0 (WebGL 2 via SwiftShader (software)). Same frame twice from fresh pages: identical. Loop: Frame 0 vs end state (progress 1): mean |Δ| 0.0000, max |Δ| 0 of 255.
Performance
About 500 small instanced flakes updated on the CPU each frame, a hundred meshes inside and one transmissive sphere (which renders the opaque scene a second time). Smooth at 1080p on laptop GPUs. Software WebGL (no GPU) renders slowly. Transmission costs a second render pass.
Export a video yourself
Download the source, then in the folder: npm install npm run render -- snow-globe/1.0.0 --out my-video.mp4Needs Node 18+, ffmpeg and Chrome/Chromium. Add --params my-settings.json (from Copy settings) for your own settings.
Version
1.0.0 · sha256:5519ab0fb96cabe4…
Files
License
MIT. Copyright (c) 2026 AI Pixel Wizard. Released under the MIT License. See LICENSE in this folder. Third-party: three.js 0.185.1 (MIT). License details
Provenance
Adapted from the owner's threejs-sketches/objects-scenes/snow-globe (MIT), rebuilt for AI Pixel Wizard in October 2026: a refracting glass sphere on a turned wooden pedestal with a brass plaque, three tiny scenes, a choreographed shake and settle (or an endless snowfall), a refractable bokeh room, and the frame/time contract.
BinMore like this

Hourglass

3D object3DSeamless loop16 seconds

Lava Lamp

3D object3DSeamless loop15 seconds

Resin Pour

3D object3DSeamless loop14 seconds