3D & backgrounds / Three.js
Ribbon flight
A narrow ribbon follows a curved path through a quiet scene.
Ribbon flightPrompt recipe · preview pending
Prompt recipe; no reproduced preview yet. You can use the prompt now; this recipe has not yet been reproduced for the gallery.
Make it fit your project.
Build a Three.js ribbon mesh along a closed Catmull-Rom curve. Sample a stable frame along the curve, move a highlight along its length using a shader uniform, and use a soft directional light to make its twists readable. Keep the mesh topology fixed.
Build and check.
- Confirm the supplied content, target environment, and required assets before implementing.
- Build a Three.js ribbon mesh along a closed Catmull-Rom curve. Sample a stable frame along the curve, move a highlight along its length using a shader uniform, and use a soft directional light to make its twists readable. Keep the mesh topology fixed.
- Expose seek(t) so frames can be inspected deterministically; add play, pause, replay, and a reduced-motion still.
- Inspect the opening, midpoint, and final state at desktop and mobile sizes; report any dependency or output limitation.
Know the limits.
- Avoid rebuilding geometry on every frame; cap the path segment count.
- The prompt guides a coding agent; output quality depends on its implementation and review.
Want us to build it?
Send an optional project brief. We’ll receive your contact details, project description, and this recipe’s ID.
Catalog 2026-10-22.a82e12098f76 · Source revision sha256:dfbe6519cbc4fc84acc4cbf926d8a01c7f2e248dd46cedd67a9112b0e928c2ba