Skip to content
AI Pixel Wizard
Your sequence0 clips
Source

Plasma Ball

A plasma globe: filaments of electric light writhe from a white-hot core and gather to a finger on the glass. Loops perfectly.

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

In Space & cosmos, Light, glass & shine, Craft & heritage

Next: HologramSurprise me

Plasma Ball 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

14
1
3

Changes the paths the filaments take.

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

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

What it is

A plasma globe on a black glossy base in a dark room: a white-hot electrode at its heart, filaments of violet light that writhe from it to the glass and jump to new paths several times a second, a bright tip where each one meets the glass, a haze that fills the sphere, and a glow that spills over the base and the table. Part-way through, a finger touches the glass and the filaments reach for the spot, then let go again. Choose the colour (violet and pink, cyan and blue, rose and amber, green and aqua), the number of filaments, the strength of the glow, whether a finger touches it, and the room.

Reuse it in your own idea

  • Tech opener: Violet, with a touch, with your title above the globe.
  • Energy theme: Green, wild, behind a counter or a chart.
  • Retro science: Rose and amber with a brass-toned table.

Which part is reusable

src/plasma-ball.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 filaments reach the glass straight from the electrode; they do not fork.
  • The finger is shown only as a bright spot on the glass and the filaments reaching for it, not as a hand.

Technical details

Technical details
Implementation
Three.js 0.185.1 (WebGL) · ES module src/plasma-ball.js
Exports
  • createPlasmaBall({ color?, filaments?, seed? }) => { group, sphere, height, uniforms, update(time, loopSeconds, camera?, { touch?, point? }), dispose() }
  • createBloomPass(renderer, { width, height, glow?, exposure?, grain? }) => { render(scene, camera, output?), dispose() }
  • PALETTES: { violet, cyan, rose, green }
Dependencies (exact)
  • three@0.185.1 (source) — Renderer, geometry and the ribbon, tip and haze shaders.
  • chrome-material@1.1.0 (demo) — Studio environment light, backdrop and contact shadow.
  • apw-runtime@1.0.0 (demo) — Demo harness.
How it fits a scene

Coordinates: 1 unit = 10 cm. The sphere has a radius of 2 and is centred 2.75 above the table; the base is 3.6 across.

Lighting: Physical glossy base and a reflection-only glass layer: needs scene.environment. Add a point light in the glow colour near the base to wash it and the table.

Timing: update(time, loopSeconds) is a pure function of time; frames render in any order.

Output
1080×1080, 30 fps, 12 s · procedural (computed from the frame number) · seamless loop — The filaments' paths come from a hash of the flicker step, taken modulo a whole number of steps per loop, so the flicker repeats exactly; the finger arrives and leaves within the loop and the camera drift is a sine of it, 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
Up to 24 filaments as 2 × 57 vertices each, shaped entirely in the vertex shader, a haze sphere, and a small bloom chain. Smooth at 1080p on laptop GPUs. Software WebGL (no GPU) renders slowly.
Export a video yourself
Download the source, then in the folder: npm install npm run render -- plasma-ball/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:c60a3add2d9cd2ec…
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/light-atmosphere/plasma-globe (MIT), rebuilt for AI Pixel Wizard in October 2026: a modelled globe on a glossy base, filament ribbons whose flicker is a looped hash of the step, tips, haze and a bloom, a finger that draws the filaments, four colourways and the frame/time contract.
BinMore like this

More like this

Play these full screen

Hologram

3D object3DSeamless loop12 seconds

Astrolabe

3D object3DSeamless loop16 seconds