---
id: "2113060310227832857"
source: https://x.com/kitasenjudesign/status/2113060310227832857
author: "Kitasenju Design (@kitasenjudesign)"
media: "video, 2648x1796, 48.8s"
model: claude-opus-5-5
generated: 2026-10-22
---
# Twisting 3D Digit Clock

## Summary
A clock made of chunky white 3D digits that stream in a twisting ribbon on black: each new time (09:07:46, 09:07:59) arrives along a spiralling path, folds over itself and settles into a readable row before the next one unwinds below. Time becomes a continuous sculpture rather than a static readout.

## Style
- Theme: dark
- Mood: hypnotic, sculptural, experimental, minimal
- Tags: clock, 3d-type, extruded-digits, ribbon, spiral, monochrome, generative
- Category: Typography, 3D

## Palette
| Role | Hex |
|---|---|
| Black | #000000 |
| Near black | #040404 |
| Charcoal | #151515 |
| Graphite | #373737 |
| Mid grey | #7F7F7F |
| Light grey | #CECECE |
| White | #F5F5F5 |

## Typography
- Digits: rounded bold grotesk, extruded about 15% of their height, matte white with soft shading. Closest free font: Manrope (800) or Nunito Sans (900).

## Layout
- 3:2 frame (2648x1796) with a faint guide grid: three horizontal lines and small dots at the intersections.
- The ribbon runs roughly down the centre; the current time settles in the top third, about 60% of the width.

## Elements
- Extruded digits with smooth bevels and soft ambient occlusion.
- A ribbon path: digit strings bend, twist and fold as they travel, sometimes stretched into thin blades.
- Background grid: thin grey lines and tiny white dots.

## Motion
- Continuous: a new time string is emitted every second and travels along a helical path.
- Strings twist around the path axis (up to 180 degrees) and stretch at sharp turns.
- The newest string unfolds into a flat, readable row, holds briefly, then is pushed down as the next arrives.

## Rebuild it
1. Generate digit meshes with three.js `TextGeometry` (bevelEnabled, depth about 0.15 of the size) and a white `MeshStandardMaterial`.
2. Define a curve (CatmullRom spiral) and deform each digit string along it with a vertex shader (or three.js `Flow` from examples).
3. Add a twist uniform proportional to the distance along the curve; ease it to zero where the string becomes readable.
4. Each second, spawn the current time (HH MM SS) at the start of the path and advance all strings along it.
5. Draw the background grid as thin lines and points on a black plane; use soft directional plus ambient light.

## Generation prompt
A sculptural 3D clock on a black background with a faint guide grid: chunky white extruded digits showing the time stream along a twisting spiral ribbon, folding and stretching as they travel, then unfolding into a crisp readable row at the top before the next second arrives; monochrome, smooth, hypnotic, generative motion design.
