Skip to content
AI Pixel Wizard
Your sequence0 clips
Source

Julia Morph

The Julia set of z² + c morphing as c circles the origin: dendrites, spirals, dust and lace in one loop. Loops perfectly.

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

In Science & maths, Patterns & illusions

Next: Faraday WaveSurprise me

Julia Morph 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

0.7885

The distance of c from the origin: about 0.79 gives the famous family of shapes.

1.2
1
1
160

Iterations per pixel: more shows finer filaments and costs more.

0.3

Where round its circle c starts, as a fraction of a turn.

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

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

What it is

The Julia set of the iteration z → z² + c, with c travelling once round a circle in the complex plane. The set grows, pinches into dust, thickens into dendrites, curls into spirals and blooms into lace: a whole family of shapes in one smooth morph that returns exactly to where it began. Three looks share the same mathematics: stained glass (the inside coloured by how close the orbit came to a circle, leaded by the edge), neon filaments (the set drawn as glowing lines by its distance estimate) and smooth bands of escape time. Choose the look, the colours (gold, ice, ember or rainbow), the orbit of c, the zoom, how far the view sways, the brightness, the detail and where on its circle c starts.

Reuse it in your own idea

  • Hypnotic music or meditation loop: Stained glass, gold.
  • Sci-fi or tech title: Neon filaments, ice.
  • Maths explainer on fractals: Rainbow dragon.

Which part is reusable

src/julia-morph.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

  • Single-precision floats limit the zoom: deep zooms into the filaments blur and band.
  • The neon look is much costlier to encode than the stained look (fast-morphing fine filaments).

Technical details

Technical details
Implementation
Three.js 0.185.1 (WebGL) · ES module src/julia-morph.js
Exports
  • createJuliaMorph({ style?, palette?, radius?, zoom?, spin?, brightness?, detail?, start? }) => { scene, camera, material, setSize(width, height), update(time, loopSeconds), dispose() }
  • createBloomPass(renderer, { width, height, glow?, exposure?, grain? }) => { render(scene, camera, output?), dispose() }
  • PALETTES: { ice, ember, neon, gold }
  • STYLES: ['neon', 'smooth', 'stained']
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: The complex plane, about 2.2 units across at zoom 1.2, centred on the origin; c = r·(cos a, sin a) with a going once round per loop.

Lighting: Self-lit: the colours are the fractal's; the bloom adds the glow of the neon look.

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 — c goes exactly once round its circle per loop, the colours cycle once, and the view's breathing and sway are sines 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 of up to 160 complex iterations per pixel (more for the finest detail) and a small bloom. About 13 ms a frame at 1080p on an integrated Intel GPU. Software WebGL (no GPU) renders in a couple of seconds a frame.
Export a video yourself
Download the source, then in the folder: npm install npm run render -- julia-morph/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:53b51a409b593075…
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/geometry-math/webgpu-julia-morph (MIT) and rebuilt for AI Pixel Wizard in October 2026 as an original shader: c exactly once round a circle, a distance-estimate neon look, an orbit-trap stained-glass look, smooth escape bands, an exact loop and the frame/time contract.
BinMore like this

More like this

Play these full screen

String Art

Background3DSeamless loop12 seconds