Skip to content
AI Pixel Wizard
Your sequence0 clips
Source

Black Hole

A black hole bending the light of the stars around it, a glowing accretion disk wrapping over and under its shadow. Loops perfectly.

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

In Space & cosmos, Light, glass & shine

Next: Aurora BorealisSurprise me

Black Hole 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

8

Degrees above the plane of the disk: low is edge-on, high looks down on it.

5

Turns the innermost ring makes in one loop; outer rings turn slower.

1
0.7

How much brighter the side of the disk coming towards you is.

1

1 is the real thing; less or more changes the size of the shadow and the rings.

1
1
5

Changes the stars, the Milky Way and the streaks in the disk.

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

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

What it is

A black hole ray-traced in curved space: every pixel's ray is bent by gravity, so the disk of glowing gas is wrapped over the top and under the bottom of the black shadow, the stars are stretched into arcs and a thin halo rings the edge of the shadow. The disk is hotter and brighter on the side moving towards you and turns in rings, each ring a whole number of turns per loop, while the camera sways slowly round. Choose the colours (gold, ice blue, red ember or violet), the viewing angle from edge-on to nearly face-on, how fast the disk spins, how bright it is, how much brighter the approaching side is, how strongly gravity bends light, the stars and the Milky Way.

Reuse it in your own idea

  • Sci-fi title: Gold disk behind a kinetic title.
  • Music or podcast loop: Red ember, slow.
  • Science explainer: Blue quasar, tilted, with a narrator.

Which part is reusable

src/black-hole.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

  • A non-spinning (Schwarzschild) hole: the shadow is a circle; the disk is a thin sheet with no vertical thickness or jets.
  • Rays that orbit the photon sphere many times are cut off after 170 steps, so the very thinnest higher-order rings are missing.

Technical details

Technical details
Implementation
Three.js 0.185.1 (WebGL) · ES module src/black-hole.js
Exports
  • createBlackHole({ palette?, tilt?, spin?, brightness?, doppler?, gravity?, stars?, milkyWay?, seed? }) => { scene, camera, material, setSize(width, height), update(time, loopSeconds), dispose() }
  • createBloomPass(renderer, { width, height, glow?, exposure?, grain? }) => { render(scene, camera, output?), dispose() }
  • PALETTES: { gold, ice, ember, violet }
Dependencies (exact)
  • three@0.185.1 (source) — Renderer, the full-screen shader and the bloom targets.
  • apw-runtime@1.0.0 (demo) — Demo harness.
How it fits a scene

Coordinates: Units of the hole's mass M: the horizon is at 2, the photon sphere at 3, the disk from 6 to 18; the camera sits 36 away, looking at the centre.

Lighting: Self-lit: the disk glows, with the Doppler and gravitational shifts of its colour and brightness.

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 — The gas turns in rings, each a whole number of turns per loop (the dark lanes between them hide the seams), the turbulence in the disk is noise read round a circle in time, and the camera's sway is a sine of the loop, so the last frame meets the first.
Tested
Rendered 360 frames on 2026-10-05 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: up to 170 ray steps per pixel and a small baked noise texture, plus a small bloom. About 12 ms a frame at 1080p on an integrated Intel GPU. Software WebGL (no GPU) renders slowly, several seconds a frame.
Export a video yourself
Download the source, then in the folder: npm install npm run render -- black-hole/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:9cfb60601095016a…
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/space-cosmic/black-hole (with webgpu-black-hole, accretion-disk and gravitational-lens, MIT) and rebuilt for AI Pixel Wizard in October 2026 as an original ray-tracer: light bent by the Schwarzschild photon orbit, a thin accretion disk with Doppler and gravitational shifts, lensed stars and Milky Way, rings that turn whole times a loop, an exact loop and the frame/time contract.
BinMore like this

More like this

Play these full screen

Hologram

3D object3DSeamless loop12 seconds