Skip to content
AI Pixel Wizard
Your sequence0 clips
Source

Aurora Borealis

The northern lights rippling over a frozen lake, a cabin's window glowing on the shore. Loops perfectly.

Background, V1 Effects3DSeamless loop, verified383 lines of codev1.0.0

In Space & cosmos, Light, glass & shine, Nature & weather

Next: Aurora TunnelSurprise me

Aurora Borealis preview
Starting live preview…
00:00:00:00 / 00:00:00:01

Live, running the real source at reduced resolution.

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

Effect controls

Presets

2
1
1
1
1
3

Changes the stars, the hills and trees, where the curtains fold and the pattern of their rays.

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

View code Sample video (default settings, 7.7 MB)
Info

What it is

Curtains of light folding and rippling across a starry sky, pink at their lower edge, green through the body and violet at the top, with a pale Milky Way behind them, a forested shore with a small cabin whose window glows in the dark, and the whole sky mirrored in the frozen lake. The curtains sway, shimmer along their vertical rays and brighten in slow surges, while the camera pans gently. Choose the colours (classic green, violet and pink, cyan and blue, or a rare red aurora), how many curtains (one to three), how bright they are, the stars and the Milky Way, whether the cabin is there, and how much the ice mirrors.

Reuse it in your own idea

  • Meditation or sleep video: Classic green over the lake, slow, with a soft voice-over.
  • Travel or winter intro: Violet and pink with a title in the dark sky.
  • Fantasy scene: Rare red storm under a kinetic title.

Which part is reusable

src/aurora-borealis.js is the ingredient your AI reuses. demo.js is only the example scene around it, and uses the demo harness only for the demo.

Good to know

  • The shore is a silhouette: the trees and the cabin have no detail.
  • The aurora is drawn from a camera at the ground looking north; there is no overhead corona.
  • Where a curtain is seen almost edge-on at the sides of the frame, its rays blend into a soft glow.

Technical details

Technical details
Implementation
Three.js 0.185.1 (WebGL) · ES module src/aurora-borealis.js
Exports
  • createAurora({ palette?, curtains?, intensity?, cabin?, milkyWay?, stars?, reflection?, seed? }) => { scene, camera, material, setSize(width, height), update(time, loopSeconds), dispose() }
  • PALETTES: { green, violet, cyan, red }
Dependencies (exact)
  • three@0.185.1 (source) — Renderer and the full-screen shader.
  • apw-runtime@1.0.0 (demo) — Demo harness.
How it fits a scene

Coordinates: Screen space: the horizon sits in the lower third; the sky is drawn above it and mirrored below.

Lighting: Self-lit: every light is part of the shader.

Timing: update(time, loopSeconds) sets the loop phase; frames render in any order.

Output
1080×1080, 30 fps, 12 s · procedural (computed from the frame number) · seamless loop — Every sway, shimmer and surge is a sine with a whole number of cycles per loop or a noise read round a circle in time, the stars twinkle in whole cycles and the pan is a sine of the loop, so 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
One full-screen pass and one small baked noise texture: 36 slices through up to three curtains per pixel. About 17 ms a frame at 1080p with two curtains on an integrated Intel GPU. Software WebGL (no GPU) renders slowly.
Export a video yourself
Download the source, then in the folder: npm install npm run render -- aurora-borealis/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:04b6b0a59e084684…
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/fire-weather/aurora-storm (and light-atmosphere/aurora-curtain, space-cosmic/webgpu-aurora-borealis, nature-organic/aurora-waves, MIT), rebuilt for AI Pixel Wizard in October 2026 as an original shader: thin curtains standing on swaying curves, integrated exactly along every view ray, with shimmering vertical rays of every length and real auroral colours, stars, a Milky Way, a forest shore with a cabin, a mirror in the ice, an exact loop and the frame/time contract.
BinMore like this

More like this

Play these full screen

Campfire

Background3DSeamless loop12 seconds

Jellyfish

Background3DSeamless loop12 seconds

Black Hole

Background3DSeamless loop12 seconds