Skip to content

Seifert Surface

A translucent shimmering band with three half-twists whose single glowing edge is a trefoil knot, pulses of light running round it. Loops perfectly.

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

In Science & maths, Light, glass & shine

Next: Boy's SurfaceSurprise me

Seifert Surface 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

1
14
1
1
18

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

Info

What it is

A knot you can hold a film across. The trefoil, the simplest knot, is the single edge of a band given three half-twists, so a soap film spanning it is a ribbon that twists three times as it goes round, with one side, one edge, and that edge tied in a knot. Here the band is a translucent, shimmering surface with a glowing knotted edge along which pulses of light run while the whole thing turns. Choose the finish (shimmer, rose, gold or ink), the width of the band, the number of pulses, the laps they make per loop, the turns of the knot per loop, the seed, the backdrop colour and whether the camera sways.

Reuse it in your own idea

  • Maths explainer: Shimmer, 14 pulses.
  • Soft: Rose, wide.
  • Luxe: Gold, many pulses.

Which part is reusable

src/seifert-surface.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

  • A band with three half-twists is a spanning surface of the trefoil but is one-sided, so it is not an orientable Seifert surface; the genus-one Seifert surface needs a more complex shape.
  • The band is translucent without true refraction.

Technical details

Technical details
Implementation
Three.js 0.185.1 (WebGL) · ES module src/seifert-surface.js
Exports
  • createSeifertSurface({ finish?, width?, pulses?, laps?, turns?, seed? }) => { group, setProgress(progress), dispose() }
  • FINISHES: { shimmer, rose, gold, ink }
Dependencies (exact)
  • three@0.185.1 (source) — Renderer, geometry and shader materials.
  • 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: The band's core circle has radius 2.4 and it is hung 3.3 above the floor; the band's half-width is 1.05 × the width setting; its three half-twists give a trefoil edge.

Lighting: A warm key light with a shadow map and the studio environment on the translucent band; the edge and pulses are self-lit.

Timing: setProgress(progress) places each pulse along the edge curve and turns the group; frames render in any order.

Output
1080×1080, 30 fps, 16 s · procedural (computed from the frame number) · seamless loop — The pulses make a whole number of laps of the edge per loop, the knot turns a whole number of times and its tilt is a sine of the loop, so the last frame meets the first.
Tested
Rendered 480 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
A static band mesh of about 11 500 triangles, a tube of about 14 000 and up to 40 instanced pulses with a shadow map: a couple of milliseconds a frame on an integrated Intel GPU. Software WebGL renders in about three seconds a frame.
Export a video yourself
Download the source, then in the folder: npm install npm run render -- seifert-surface/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:6f26abd6c80c95e2…
Files
License
MIT. Copyright (c) 2026 AI Pixel Wizard. Released under the MIT License. See LICENSE in this folder. License details
Provenance
Adapted from the owner's threejs-sketches/geometry-math/seifert-surface (MIT) and rebuilt for AI Pixel Wizard in October 2026 as an original studio object: a three-half-twist band whose edge is a trefoil knot, drawn as a translucent iridescent surface with a glowing edge tube and pulses riding it by arc length, on an exact loop.
BinMore like this

Piano Keys

3D object3DSeamless loop16 seconds

Soap Film

3D object3DSeamless loop12 seconds

Ferrofluid

3D object3DSeamless loop16 seconds